文章目录
一、app.json配置二、获取经纬度三、打开地图选择位置信息四、补充一、app.json配置
wx.getLocation和wx.chooseLocation使用时需要声明
"permission": {"scope.userLocation": {"desc": "您的位置将在小程序地图上展示"}},"requiredPrivateInfos": ["getLocation","chooseLocation"]
二、获取经纬度
index.ts代码
官方文档:wx.getLocation 使用该方法获取经纬度
Page({data:{lng:0, // 经度lat:0 // 纬度},onLoad() {// 在需要使用地图或需要使用经纬度的地方使用 wx.getLocation 询问用户是否授权位置信息wx.getLocation({type: 'wgs84',success(res) {console.log(res)that.setData({lat: res.latitude,lng: res.longitude})},fail(err) {console.log(err)}})}})
授权截图
输出结果
三、打开地图选择位置信息
官网文档:wx.chooseLocation 使用此方法打开地图
index.WXML代码
<view class="container"><button class="map" type="primary" bindtap="mapOpen">地图</button></view>
index.ts代码
Page({data: {lat: 0,lng: 0,},onLoad() {// 获取用户经纬度wx.getLocation({type: 'gcj02',success(res) {console.log(res)that.setData({lat: res.latitude,lng: res.longitude})},fail(err) {console.log(err)}})},mapOpen() {let that = thiswx.chooseLocation({latitude: that.data.lat,longitude: that.data.lng,success(res) {// 选择位置返回的信息console.log(res)}})},})
地图截图
输出结果
四、补充
从我们获取到的详细信息中获取到省 市 区
mapOpen() {let that = thiswx.chooseLocation({latitude: that.data.lat,longitude: that.data.lng,success(res) {console.log(res.address.slice(0, res.address.indexOf('省') + 1))console.log(res.address.slice(res.address.indexOf('省') + 1, res.address.indexOf('市') + 1))console.log(res.address.slice(res.address.indexOf('市') + 1, res.address.indexOf('区') + 1))console.log(res.name)}})},
输出结果