微信小程序--打开第三方地图

微信小程序–打开第三方地图

一、已知目标地址经纬度跳转
const data={
    {
        id: '1',
        name: '目标地址名称',
        address:'目标详细地址',
        latitude: 30.384209,
        longitude: 104.554695 //经纬度

      }
}

 wx.getLocation({
      type: 'gcj02', // 默认为 wgs84 返回 gps 坐标,gcj02 返回可用于 wx.openLocation 的坐标
      success: function (res) {
      wx.openLocation({
          latitude:data.latitude
          longitude: data.longitude, // 经度
          name:data.name,
          scale: 10, // 缩放比例          
        })
      }
 }

案例图:

1、点击跳转

在这里插入图片描述

2、选择导航跳转第三方软件

在这里插入图片描述

在这里插入图片描述

二、利用微信小程序获取经纬度
wx.chooseLocation({
   success: function (res) {
      console.log(res); 
    },
    fail: function () {
    },
    complete: function () {
    }
})

在这里插入图片描述

点击确认后会返回选择目标地址的经纬度,名字和具体位置信息

在这里插入图片描述

要实现微信小程序跳转腾讯地图导航功能,需要使用腾讯地图提供的URL Scheme。下面是一个示例URL: ``` https://apis.map.qq.com/uri/v1/marker?marker=coord:39.984154,116.307490;title:我的位置&referer=myapp ``` 其中,参数marker表示标注点信息,包括经纬度和标题。referer表示来源应用的名称,可以自定义。 如果需要导航功能,需要在URL中添加参数: ``` type=drive ``` 表示导航方式为驾车导航。其他导航方式的参数值为: - drive:驾车导航 - bus:公交导航 - walk:步行导航 - bike:骑行导航 可以根据需要选择合适的导航方式。 在小程序中,可以使用wx.navigateToMiniProgram打开腾讯地图小程序,并传递参数。示例代码如下: ``` wx.navigateToMiniProgram({ appId: 'wxbb8a5dcb3c3a7703', // 腾讯地图小程序appId path: 'pages/map/index', // 打开的页面路径 extraData: { type: 'drive', // 导航方式 marker: 'coord:39.984154,116.307490;title:我的位置' // 标注点信息 }, success(res) { // 打开成功 }, fail(res) { // 打开失败 } }) ``` 在腾讯地图小程序中,可以使用getApp()方法获取小程序实例,然后通过this.getOpenerEventChannel()方法获取打开小程序的事件通道,从而获取传递的参数。示例代码如下: ``` const app = getApp() const eventChannel = app.getOpenerEventChannel() eventChannel.on('extraData', function(data) { console.log(data.type) // 导航方式 console.log(data.marker) // 标注点信息 }) ```
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值