在开发微信小程序项目中,遇到了需要使用高德地图来逆地址解析获取地理位置的问题,以下为本人使用的流程步骤。
一、关于如何在uniapp中使用引入高德地图微信小程序插件
1.注册高德账号,认证通过成为个人或者企业开发者
2. 创建应用,设置key
3.下载微信小程序SDK
4.项目中引用
因为目前仅使用到了通过api进行逆地址解析获取地址,并不涉及显示地图和地图打点,这里 就不做示范。
4.1 在项目根目录下解压第3步下载的微信小程序插件
4.2 在项目utils文件中新建locationGps JS文件并在文件中引入高德插件
/** 使用第三方地图逆地址解析经纬度获取用户当前所在位置信息
* @param {Number} lat
* @param {Number} lng
*/
export const getUserCurrentLocationInfo = (lat, lng) => {
var GDMapWX = require('../assets/GD/amap-wx.js');
var GDMapSdk = new GDMapWX.AMapWX({
key: '第2步申请的key' // 必填
});
return new Promise((resolve, reject) => {
GDMapSdk.getRegeo({
location: lng + ',' + lat,
success: res => {
resolve()
},
fail: function(error) {
reject()
}
})
})
}
二、逆地址解析数据问题
1.POI数据问题
在通过一获取到解析数据后,返回的数据太多了,并且大部分都用不到,尤其是POI数据。但是通过高德微信小程序插件api的方式来获取数据,并没有办法控制是否返回POI数据。
也通过提工单的方式询问了高德技术客服,给出的解决方式是前端通过uni.request方式来调用高德 Web服务 API 地址来通过HTTP/HTTPS 协议访问远程服务的接口来获取数据,该方式可以通过入参来控制是否返回POI数据。
由于并不满足本人的需求,所以看了下高德微信小程序插件的源码,发现可以通过修改源码方式来实现。
1.1 首先先看下源码的接口及各个方法,其中红框框起来的则是本次涉及需要改动的方法
1.2 下面是getRegeo方法的具体逻辑,及该方法内需要修改的地方
特别说明:
下图中的第2,4步的改动原因:
a. 首先第一次改动为 g.roads.length ? g.roads[0].name + "\u9644\u8fd1" : "",这样改是因为微信公众平台中We分析经常报错 roads[0].name
b. 然后第二次改动则是因为由于设置了 base 不返回poi数据,所以在 g.roads.length时会undefined,所以就再次修改成目前的 g.roads && g.roads.length 这种写法。
utils中则只需要和location 同级中添加 extensions 参数来控制就好