前段时间有个群友问起小程序地图怎么点击直接进行导航！刚好我也在网上查找了下相关代码，整理了下，下面就是详细的说明！
首先在wxml文件中输入地图代码，相关内容自行查阅小程序开发教程
<map?class="maps"?id="map"?longitude="112.8977300000"?latitude="28.2174900000"?scale="16"?style="width:100%;height:500rpx;"?bindtap="mapclick"?markers="{{markers}}"></map>
longitude：经度
latitude：纬度
markers：标记(这个要动态的传递数值，所以这里就使用{{markers}})
下面就是markers的数值传递，在page的data中设置markers数组的值
Page({
??data:?{
????markers:?[{
??????iconPath:?"/images/location.png",//定位图标
??????id:?0,
??????latitude:?28.2174900000,//纬度
??????longitude:?112.8977300000,//经度
??????width:?50,//图标宽
??????height:?50,//图标高
????}],
??},?
}）
这样前端的地图组件就定位完成！
下一步操作就是怎么进行直接导航，这里使用微信自带的导航组件wx.openLocation(相关内容自行查阅小程序开发教程)
首先在地图上绑定一个事件,使用bindtap=”mapclick” 来绑定点击地图的操作事件mapclick,然后就是设置点击事件。
mapclick:?function?()?{
????wx.openLocation({
??????latitude:?28.2174900000,//纬度
??????longitude:?112.8977300000,//经度
??????scale:?18,//缩放
??????name:?'湖南翱云网络科技有限公司',
??????address:?'湖南长沙岳麓区桐梓坡西路雅阁国际'
????})
??},
声明：本站所有文章，如无特殊说明或标注，均为本站原创发布。任何个人或组织，在未征得本站同意时，禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益，可联系我们进行处理。
