前言
微信公众号获取的用户当前位置直接放到高德地图api上会偏差非常大,所以需要校正。
如下我分为三步调用:获取当前用户位置->转换成高德坐标->再初始化地图或者设置地图标点
实现
微信定位获取
wx.getLocation({
success: function (res) {
mapConvertFrom(res.longitude, res.latitude)
},
cancel: function (res) {
alert('用户拒绝授权获取地理位置');
}
});
微信位置坐标转换高德坐标
/**
* ----------------------------------------------------------------------------------------------
* 微信位置坐标转换高德坐标
* @return
*/
function mapConvertFrom(lng, lat) {
AMap.convertFrom(new AMap.LngLat(lng, lat), 'gps', function (status, result) {
if (result.info === 'ok') {
initAMap(result.locations[0].lng, result.locations[0].lat);
}
})
}
初始化高德地图
/**
* ----------------------------------------------------------------------------------------------
* 初始化地图
* @return
*/
function initAMap(lng, lat) {
var map = new AMap.Map('container', {
pitch: 40, // 倾斜角度
viewMode: '3D', // 默认使用 2D 模式,如果希望使用带有俯仰角的 3D 模式,请设置 viewMode: '3D',
zoom: 18, // 初始化地图层级,地图默认缩放大小
buildingAnimation: true, // 建筑出现的动画
center: [lng, lat] // 初始化地图中心点
});
// 添加点标
var marker = new AMap.Marker({
position: [lng, lat],
map: map
});
}