微信小程序用于定位并导航到指定位置的示例代码

电脑杂谈  发布时间:2020-05-25 14:14:31  来源:网络整理

微信网页调用地图导航_微信调用百度地图教程_微信网页调用地图导航

<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
})
}
})
}
})

微信调用百度地图教程_微信网页调用地图导航_微信网页调用地图导航

根据以上所述微信网页调用地图导航,您可以实现自己的定位和导航到指定位置微信网页调用地图导航,如下所示:

微信网页调用地图导航_微信网页调用地图导航_微信调用百度地图教程

以上是本文的全部内容,希望对大家的学习有所帮助,并希望每个人都支持此脚本.


本文来自电脑杂谈,转载请注明本文网址:
https://www.pc-fly.com/a/shouji/article-221781-1.html

    相关阅读
      发表评论  请自觉遵守互联网相关的政策法规,严禁发布、暴力、反动的言论

      热点图片
      拼命载入中...