js室内地图开发_入门指南-室内地图 JS API

快速入门将带您迅速了解高德地图室内JS API的基本使用，学习如何创建和设置地图，是您在最短时间内成为JS API的开发者。

第1步准备页面

在正式开始开发地图应用之前,您需要做如下几步:

申请JS API的开发者key

申请室内地图数据

室内地图数据访问权限与开发者key绑定，需要申请开通访问权限！

请前往室内地图数据申请申请室内地图数据。烦请务必提供您所申请的开发者key！

引入高德室内地图JavaScript API几何样式文件：

引入高德室内地图JavaScript API文本样式文件:

创建地图容器

在页面body里你想展示地图的地方创建一个div 容器，并指定id标识:

指定容器大小

按照需要设定地图容器的大小，确保大小合适,比如用CSS这样设置它:#container {width:300px; height: 180px; }

第2步创建地图

做完简单的准备工作之后，就可以开始创建地图了.

//示例初始化地图

var map = new Indoor.Map('container',{

key:'开发者key',

buildingId:'建筑物ID'

});

//由于地图数据使用了异步加载，为避免出错请把所有的逻辑放在mapready事件内

map.once('mapready',function(){

console.log(map.getFloor());

})

第3步地图选项

OptionTypeDefaultAllowEmptyDescription

keyStringnullno申请JSAPI的开发者key,

申请地址：https://lbs.amap.com/dev/key

注：key需要绑定Web服务API

buildingIdStringnullno建筑物ID.

floorNumbernullyes地图加载指定的楼层

zoomNumbernullyes地图加载指定的层级

floorControlBooleantrueyes是否显示楼层控件

detailTipControlBooleantrueyes是否显示详情tip控件，pc端显示在水滴图标上，

mo单独显示在页脚.

searchBarControlBooleantrueyes是否显示搜索控件

routeControlBooleantrueyes是否显示路算控件

zoomControlBooleantrueyes是否显示载放大／缩小控件

imagePathStringimagesyes图片资源路径，默认和jsapi在相同路径下的images目录

highlightFeatrueClickBooleanfalseyes点击商铺后是否高亮显示

renderColorsArray [object]nullyes自定义颜色渲染，见下面示例

indoorExtraStringnullyes自定义标识字符串，通过标识来实现自定义统计，

注：字符串中不要带&和=字符,

通过KEY:VAULE的形式传递多组字段和内容，

例:KEY1:VAULE1;KEY2:VAULE2

注意：如若出现地图数据加载问题，有可能是如下问题导致，可逐一检查确认：

1)提供的开发者key不正确；

2)key绑定的JS API服务不正确；

3)室内建筑ID不正确；

4)未获取室内建筑数据的访问权限。

室内数据访问权限及申请地址如下：申请室内地图数据

js室内地图开发_入门指南-室内地图 JS API | 高德地图API相关推荐

node.js Web应用框架Express入门指南
node.js Web应用框架Express入门指南作者: 字体:[增加减小] 类型:转载时间:2014-05-28 我要评论这篇文章主要介绍了node.js Web应用框架Express入门 ...
XBOOT集成开发环境入门指南
xboot集成开发环境之Eclipse 安装Eclipse集成开发环境启动Eclipse集成开发环境导入xboot源码编译xboot源码在模拟器中运行xboot 调试xboot 编译xboot ...
解决高德地图锁屏黑屏定位不更新，高德地图绘制定位轨迹，高德定位判断定位停留点，高德地图将所有坐标绘制在可视区域内
本文章主要介绍高德定位锁屏黑屏定位不更新的问题. 实现流程是:程序开始阶段正常执行定位,注册监听锁屏监听,唤醒cpu监听,当锁屏广播每2秒发起一起单次定位唤醒.源码如下: package net. ...
js室内地图开发_概述-室内地图 JS API | 高德地图API
室内地图 JavaScript API 简介说明: 室内地图数据对新用户暂停开放,建议您使用 Javascript API 可实现室内外一体化效果. 高德室内地图 JavaScript API,是由 ...
js室内地图开发_如何组件化开发WebGIS系统
本文同发于本人博客:http://giscafer.com/2017/01/10/modularization-webgis/ 先啰嗦两句前面聊过<探讨如何使用流行的前端技术开发WebGIS系 ...
js室内地图开发_使用JS+Three.js+Echart开发商场室内地图客流信息统计功能（下）...
(2)实时视频及全景漫游的实现: 首先创建实时视频的摄像头图片标注和全景漫游的360°图片标注,标注实现后可在地图上点击相应的图片标注从而显示实时视频画面或360°全景画面,画面可拖拽可放大缩小. 各 ...
js室内地图开发_室内地图 JavaScript API
室内地图JavaScript API文档 V1.2 主要功能类: Map API各种类中的核心部分,用来在页面中创建地图并操纵地图. //示例初始化地图 var map = new Indoor.M ...
js室内地图开发_使用JS+Three.js+Echart开发商场室内地图客流信息统计功能
现在的商场管理者在管理商场的同时面临着一些无法避免的问题比如:人员监管不到位.效率低下.商场同质化严重,人流量少等.发现了这些问题作为开发人员的我们怎能视而不见,我们的责任就是发现问题解决问题,提供更 ...
js室内地图开发_室内地图JavaScript SDK地图控制 - 蜂鸟云
地图控制 Fengmap地图加载完成后,可通过地图方法和地图进行交互. 单/多楼层显示地图加载完成后可配置楼层显示数量,当地图为多层时,地图数据的楼层ID从groupID =1开始依次向上加1,默认 ...

js室内地图开发_入门指南-室内地图 JS API | 高德地图API

js室内地图开发_入门指南-室内地图 JS API | 高德地图API相关推荐

最新文章

热门文章