高德地图JavaScript API

最新推荐文章于 2024-06-06 09:28:03 发布

花铛

最新推荐文章于 2024-06-06 09:28:03 发布

阅读量963

点赞数 1

分类专栏：地图文章标签：插件高德地图

本文链接：https://blog.csdn.net/wsln_123456/article/details/95213857

版权

地图专栏收录该内容

16 篇文章 1 订阅

订阅专栏

初始化地图：

var map = new AMap.Map('map', {
     zoom: 10, //地图显示的缩放级别
     center: [116.397428, 39.90923],//中心点坐标
});

自定义图标的点标记：

//设置图标
var icon = new AMap.Icon({
      size: new AMap.Size(40, 40),
      image: '//vdata.amap.com/icons/b18/1/2.png', //图标的url
      imageSize: new AMap.Size(40, 40)   // 根据所设置的大小拉伸或压缩图片
});
var marker = new AMap.Marker({
      icon:icon,
      position: new AMap.LngLat(116.39,39.9),
      title:'北京'
});
map.add(marker);

给点标记添加事件：

//给点标记绑定点击事件
marker.on('click',function(ev){})

文本标记：

var text = new AMap.Text({
      text:$('#shopNamePanel').html(),
      offset: new AMap.Pixel(0, -60),  //设置文本标注偏移量
      position: new AMap.LngLat(116.39,39.9)
});
text.setMap(map);

从地图上移除标记：text.setMap(null);

定位：

//加载定位插件
AMap.plugin('AMap.Geolocation', function() {
     var geolocation = new AMap.Geolocation({
          enableHighAccuracy: true,//是否使用高精度定位
          zoomToAccuracy: false,   //定位成功后是否自动调整地图视野到定位点
      });
     //获取用户当前的精确位置信息
      geolocation.getCurrentPosition(function(status,result){
            if(status == 'complete'){
                  //获取当前的经纬度
                  var lnglat = result.position;
             }else{
                  alert('定位失败！');
            }
    });
});

问题：

Geolocation permission denied：地理位置没有权限。
可能原因：
用户禁用了定位权限，需要用户开启设备和浏览器的定位权限，并在浏览器弹窗中点击“允许使用定位”选项。
浏览器禁止了非安全域的定位请求，比如Chrome、IOS10已陆续禁止，这时候需要升级站点到HTTPS。注意Chrome不会禁止localhost等域名HTTP协议下的定位；

跳转高德地图客户端：

 //调起高德地图客户端标注页，在高德地图app显示marker
marker.markOnAMAP({
     position: ‘’,
     name:‘’
})

//唤起高德地图客户端驾车路径规划
driving.searchOnAMAP({
	origin:LngLat,//起点坐标
	originName: "清华大学",//起点名称
	destination:LngLat,//终点坐标
	destinationName: "首开广场" //终点名称
})