微信小程序集成腾讯地图--路线规划

想要集成腾讯地图，首先要在腾讯地图开发平台先注册账号，申请key腾讯地图开放平台

申请key

提交申请之后，key值就算申请好了，但我们还需要设置key。

设置key

我就将启用产品那栏全部勾选上了。

以上就是我们申请腾讯地图key的第一步，算是完成了。

第二步：

如图，蓝框里的代表标记点，比如起始点和终点；红框里的代表路线。

第三步：请求腾讯API 路线规划文档

注：这里用的是驾车路线规划

https://apis.map.qq.com/ws/direction/v1/driving/?from=39.915285,116.403857&to=39.915285,116.803857&output=json&callback=cb&key=OB4BZ-D4W3U-B7VVO-4PJWW-6TKDJ-WPB77

.js代码展示

var coors;

Page({

  data: {

  polyline:[], 

  markers:[

      {latitude:23.362490, longitude:116.715790, }, 

      {latitude:23.37228, longitude:116.75498, }],

  }, 

 onLoad:function (options) {

      var that =this;  

      wx.request({

          url:'https://apis.map.qq.com/ws/direction/v1/driving/?from=23.362490,116.715790&to=23.37228,116.75498&output=json&callback=cb&key='+你申请的key值            

         success:function(res){ 

              coors = res.data.result.routes[0].polyline 

              for(var i=2; i< coors.length; i++) { 

                   coors[i]= coors[i-2]+ coors[i]/1000000 

             }

             console.log(coors)

             //划线 

             var b=[]; 

             for(var i=0; i< coors.length; i=i+2) { 

                b[i/2]={latitude: coors[i],longitude:coors[i+1] }; 

                console.log(b[i/2]) 

            }

            that.setData({

                polyline: [{points: b, color:"#99FF00", width:4, dottedLine:false }], 

           })

   } 

 }) 

 },

});

最后再上一个效果图：