小程序根据坐标逆解析位置
2018-10-22 本文已影响359人
两年半练习程序员
在小程序开发中我们可以根据 小程序API提供的wx.getLocation(Object object)
https://developers.weixin.qq.com/miniprogram/dev/api/location/wx.getLocation.html
获取当前的地理位置(坐标)、速度。
那么有了坐标之后,如何转换成对应的位置名称呢?
腾讯地图为我们提供了此功能https://lbs.qq.com/index.html
打开网址进入微信小程序JavaScript SDK
![](https://img.haomeiwen.com/i13122745/ff6a9e1b9acef6fe.png)
首先我们需要先申请开发者密钥(key)
![](https://img.haomeiwen.com/i13122745/724a64c6fdb600e7.png)
填入相应内容申请
![](https://img.haomeiwen.com/i13122745/af94dba6e98b853d.png)
申请成功后可以在控制台直接查看秘钥
![](https://img.haomeiwen.com/i13122745/901ac631209ec9b7.png)
秘钥已经申请成功,下面我们进行下载微信小程序JavaScriptSDK v1.0
微信小程序JavaScriptSDK v1.0
准备工作已经完成,在使用之前记得配置小程序安全域名,在“设置” -> “开发设置”中设置request合法域名,添加,添加https://apis.map.qq.com
下面我们将刚才下载的微信小程序JavaScriptSDK v1.0引入到我们小程序内
![](https://img.haomeiwen.com/i13122745/cf97379fb450ed31.png)
接着在需要使用此功能的页面中 引入SDK核心类和实例化API核心类
// 引入SDK核心类
var QQMapWX = require('../../libs/qqmap-wx-jssdk.js');
// 实例化API核心类
var qqmapsdk = new QQMapWX({
key: '5BOBZ-3L5W6-WDJSR-ESAJ6********'//申请的开发者秘钥key
});
然后获取当前地理坐标并将其你解析为位置信息
//小程序api获取当前坐标
wx.getLocation({
success: function(res) {
console.log(res)
// 调用sdk接口
qqmapsdk.reverseGeocoder({
location: {
latitude: res.latitude,
longitude: res.longitude
},
success: function (res) {
//获取当前地址成功
console.log(res);
},
fail: function (res) {
console.log('获取当前地址失败');
}
});
},
})
我们将返回值打印出来
wx.getLocation返回值
![](https://img.haomeiwen.com/i13122745/c9047f6ad97ad91f.png)
reverseGeocoder返回值
![](https://img.haomeiwen.com/i13122745/e7379d620aaa4392.png)
已拿到具体位置
更多腾讯地图提供的使用方法请查看https://lbs.qq.com/qqmap_wx_jssdk/method-reverseGeocoder.html
![](https://img.haomeiwen.com/i13122745/da228daf42bcb463.jpg)