uniapp 微信小程序内打开腾讯导航路线规划

1、需要在小程序后台管理,添加腾讯位置服务路线规划插件

2、详情中看AppId和版本号,后面会用到这两个参数

3、申请通过后,参考指南开发

4、 在uniapp项目的pages.json中增加插件及开启位置服务

"plugins": {
    "routePlan": {
      "version": "1.0.19",
      "provider": "wx50*************"
    }
  },
  "permission": {
    "scope.userLocation": {
      "desc": "你的位置信息将用于小程序位置接口的效果展示"
    }
  }

5、在模拟器中发现无法访问,解决:在manifest.json源码文件中也添加一份

/* 小程序特有相关 */
    "mp-weixin" : {
        "appid" : "wxd********",
        "setting" : {
            "urlCheck" : false,
            "minified" : true
        },
        "usingComponents" : true,
        "plugins" : {
            "routePlan" : {
                "version" : "1.0.19",
                "provider" : "wx5********"
            }
        },
        "permission" : {
            "scope.userLocation" : {
                "desc" : "你的位置信息将用于小程序位置接口的效果展示"
            }
        }
    },

6、实现

<template>
  <view>
     <button class="btn-long" @click="doNavi()">导航</button>
  </view>
</template>

<script>
	export default {
	methods: {
      doNavi(){
        let plugin = requirePlugin('routePlan');
        let key = 'GNSBZ-*************';  //使用在腾讯位置服务申请的key
        let referer = 'S*****';   //调用插件的app的名称
        let startPoint = JSON.stringify({  //终点
          'name': '崂山区天宝国际停车场',
          'latitude': 36.66826,
          'longitude': 117.02076
        });
        let endPoint = JSON.stringify({  //终点
          'name': '青岛大学',
          latitude: 36.10061184894021,
          longitude: 120.45523630249923
        });
        uni.navigateTo({
          url: 'plugin://routePlan/index?key=' + key + '&referer=' + referer + '&endPoint=' + endPoint+ '&startPoint=' + startPoint+'&navigation=1',
          success(res) {
            console.log("res==1111=",res)
          },
          fail(res) {
            console.log("res==2222=",res)
          },
        });
      }
    },
	}
</script>

猜你喜欢

转载自blog.csdn.net/LzzMandy/article/details/122066435