定位

地图初始化加载定位到当前城市

创建AMap.Map对象时如果没有传入center参数,您会发现地图将自动定位到您所在城市并显示,这就是JS API的初始加载定位:无需传入对应参数就能获取大致的定位信息。以下代码运行后将显示您所在城市的地图:

var map = new AMap.Map('container', {
  resizeEnable: true
})

AMap.Geolocation

AMap.Geolocation 定位服务插件。融合了浏览器定位、高精度IP定位、安卓定位sdk辅助定位等多种手段,提供了获取当前准确位置、获取当前城市信息、持续定位(浏览器定位)等功能。

默认情况下,PC 端优先使用精确 IP 定位,解决多数浏览器无法完成定位的现状,IP定位失败后使用浏览器定位;手机端优先使用浏览器定位,失败后使用IP定位;对于安卓 WebView 页面的开发者,可以结合定位 sdk 进行辅助定位。

Chrome、IOS10等已不再支持非安全域的浏览器定位请求,为保证定位成功率和精度,需要将站点升级到HTTPS。

map = new AMap.Map('iCenter');
map.plugin('AMap.Geolocation', function() {
  var geolocation = new AMap.Geolocation({
    enableHighAccuracy: true, // 是否使用高精度定位,默认:true
    timeout: 10000, // 超过10秒后停止定位,默认:无穷大
    maximumAge: 0, // 定位结果缓存0毫秒,默认:0
    convert: true, // 自动偏移坐标,偏移后的坐标为高德坐标,默认:true
    showButton: true, // 显示定位按钮,默认:true
    buttonPosition: 'LB', // 定位按钮停靠位置,默认:'LB',左下角
    buttonOffset: new AMap.Pixel(10, 20), // 定位按钮与设置的停靠位置的偏移量,默认:Pixel(10, 20)
    showMarker: true, // 定位成功后在定位到的位置显示点标记,默认:true
    showCircle: true, // 定位成功后用圆圈表示定位精度范围,默认:true
    panToLocation: true, // 定位成功后将定位到的位置作为地图中心点,默认:true
    zoomToAccuracy: true // 定位成功后调整地图视野范围使定位位置及精度范围视野内可见,默认:false
  })
  geolocation.getCurrentPosition()
  AMap.event.addListener(geolocation, 'complete', onComplete)
  AMap.event.addListener(geolocation, 'error', onError)
  function onComplete (data) {
    // data是具体的定位信息
    console.log('定位结果:' + data.position);
    console.log('定位类别:' + data.location_type);
  }
  function onError (data) {
    // 定位出错
  }
})

参考:

MIT Licensed | Copyright © 2018-present 滇ICP备16006294号

Design by Quanzaiyu | Power by VuePress