- 可以使用
wx.getLocation来获取设备所在经纬度,再用腾讯地图QQMap.reverseGeocoder方法解析地址,获取当前具体地址信息
使用wx.getLocation需要在app.json中进行配置
"requiredPrivateInfos": [
"getLocation",
"chooseLocation"
],
"permission": {
"scope.userLocation": {
"desc": "你的位置信息将用于小程序位置接口的效果展示"
}
},
- 登录腾讯位置服务配置密钥并下载js文件,文件放到libs文件夹中,再封装一个QQMap工具模块
微信小程序JavaScript SDK | 腾讯位置服务 (qq.com)
去官网下载这个qqmap-wx-jssdk.min
然后按官网配置KEY
下一步在你的项目根目录下创建libs文件夹,并将qqmap-wx-jssdk.min放进去
最后封装一个传入key的模块,方便使用
import QQMap from '../libs/qqmap-wx-jssdk.min'
export default new QQMap({
key: '你的key'
})
- 使用
QQMap.search方法来搜索附近地址,可以通过keyword传入搜索关键字,来指定查询目标 - 再需要重新定位时,使用
wx.chooseLocation来显示周围地图详情,来精准选择位置,并返回新选择的
Page({
data: {
address: '',
list: []
},
onLoad() {
this.getMyLocation()
},
//获取经纬度
async getMyLocation() {
const {
latitude,
longitude
} = await wx.getLocation()
this.getPoint(latitude, longitude)
this.searchLocation(latitude, longitude)
},
//解析经纬度,并获取地址
getPoint(latitude, longitude) {
QQMap.reverseGeocoder({
location: latitude + ',' + longitude,
success: (res) => {
this.setData({
address: res.result.address
})
}
})
},
//搜索当前经纬度附近符合关键字的位置
searchLocation(latitude, longitude) {
QQMap.search({
keyword: '住宅小区',
location: latitude + ',' + longitude,
success: (res) => {
console.log(res.data);
this.setData({
list: res.data
})
}
})
},
//根据当前位置重新定位
async research() {
const {
latitude,
longitude
} = await wx.chooseLocation()
this.getPoint(latitude, longitude)
this.searchLocation(latitude, longitude)
}
})