- 在
app.json
中开发小程序的接口权限,设置permission
的权限,在里面配置scope.userLocation
,开放位置权限,代码如下所示:
"permission": {
"scope.userLocation": {
"desc": "你的位置信息将用于小程序位置接口的展示"
}
},
- 在页面
indx.wxml
中,调用map
的信息,代码如下所示:
<map id="map" longitude="{{longitude}}" latitude="{{latitude}}" scale="14" class="map"></map>
- 在
data
中定义经度和纬度信息,设置longitude
和latitude
的值为空,代码如下所示:
longitude: "",
latitude: ""
- 在页面当中
index.js
进行相应的配置,在Page
中,onShow()
方法调用一个获取位置的函数,使得一进入页面的时候,就会执行,获取到当前的位置信息,代码如下所示:
onShow() {
this.getLocation()
}
- 在
Page
中定义getLocation()
函数,写上wx.getLocation()
方法,获取到当前的地理位置,在里面定义type
类型为gcj02
,同时调用成功后的回调函数,代码如下所示:
getLocation() {
wx.getLocation({
type: 'gcj02',
success: this.getLocationSucces.bind(this)
})
}
- 在
Page
中定义getLocationSucces()
函数,通过this.setData()
方法,将响应获得的经度和纬度值赋值给当前的经度和纬度值,就可以成功使用地图开发获取到当前的位置信息,代码如下所示:
getLocationSucces(res) {
this.setData({
longitude: res.longitude,
latitude: res.latitude
})
}
旧城tk
发布了125 篇原创文章 · 获赞 29 · 访问量 2万+
私信
关注