高德地图 室内地图

来源:互联网 发布:visualbasic2010 mac版 编辑:程序博客网 时间:2024/04/30 07:12

室内地图

高德地图JavaScript
API提供了室内地图的展示功能,在一些浏览器中我们会自动为地图添加和展示室内地图图层,开发者也可以自行加载室内图层插件,做室内地图单独展示或者叠加展示。

由于本人属于个人开发者,未能获取高德的室内地图申请key,所以就算了,有兴趣的伙伴可以通过这个链接,以公司的名义去申请key
http://lbs.amap.com/cooperation/indoordata/

下面我们通过官网的demo例子来学习以下吧
官网api
这里写图片描述

官网为我们提供了5个参数,下面我们通过官方给定的地图来尝试一下各自的效果是怎么样的?默认情况下:

//create mapvar map = new AMap.Map('mapDiv', {      resizeEnable: true,      center:[116.519942, 39.924677],      zoom:18});//显示室内地图map.on('indoor_create',function(){      map.indoorMap.showIndoorMap('B000A856LJ',5);//显示某一层,后面加数字})

这里写图片描述

场景二、单独或者叠加显示某个商场的室内地图

如果你是某团购APP的负责人,为了让消费者快速准确的找到商家在楼内的位置,这时候就可以使用室内地图的功能,具体实现方法如下:

 AMap.plugin(['AMap.IndoorMap'], function() {        var indoorMap = new AMap.IndoorMap({alwaysShow:true});        //设定在没有矢量底图的时候也显示,默认情况下室内图仅在有矢量底图的时候显示        var map = new AMap.Map('container', {            resizeEnable: true,            showIndoorMap:false,//隐藏地图自带的室内地图图层            layers:[indoorMap]        });        indoorMap.showIndoorMap('B000A856LJ');      });

这里写图片描述

0 0