富贵资源网 Design By www.hznty.com
一：实现定位及到指定位置导航所需组件及API
1：组件：map(地图组件)
2：API：wx.getLocation(Object object)(获取当前的地理位置、速度)，wx.openLocation(Object object)(使用微信内置地图查看位置)
二：代码实现
1：wxml
<view>
<map id="map"
longitude="{{longitude}}"
latitude="{{latitude}}"
scale="14"
markers="{{markers}}"
bindmarkertap="markertap"
bindregionchange="regionchange"
show-location
style="width: 100%; height: 300px;"
>
</map>
</view>
<view>
<button type="primary" bindtap="navigate">导航</button>
</view>
2：js
//js
Page({
/**
* 页面的初始数据
*/
data: {
//设置标记点
markers: [
{
iconPath: "/images/ljx.png",
id: 4,
latitude: 31.938841,
longitude: 118.799698,
width: 30,
height: 30
}
],
//当前定位位置
latitude:'',
longitude: '',
},
navigate() {
////使用微信内置地图查看标记点位置，并进行导航
wx.openLocation({
latitude: this.data.markers[0].latitude,//要去的纬度-地址
longitude: this.data.markers[0].longitude,//要去的经度-地址
})
},
onLoad() {
//获取当前位置
wx.getLocation({
type: 'gcj02',
success: (res) => {
console.log(res)
this.setData({
latitude: res.latitude,
longitude: res.longitude
})
}
})
}
})
根据如上即可实现自身定位及到指定位置的导航，如下：
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。
富贵资源网 Design By www.hznty.com
广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！
富贵资源网 Design By www.hznty.com
暂无评论...