微信小程序通过腾讯地图规划路线

分手后的思念是犯贱 2022-05-25 04:53 411阅读 0赞

参考：[https://blog.csdn.net/u011330225/article/details/74612620][https_blog.csdn.net_u011330225_article_details_74612620]

index.wxml:
    <map id="map" polyline="{
       {polyline}}" markers="{
       {markers}}" include-points="{
       {markers}}" style="width: 100%; height: 700rpx;"></map>
    
    
    index.js:

var coors;
    const config = require("../../utils/config.js");
    var qqMapKey = config.qqMapSdk;
    Page({
        data: {
            polyline:[],
            markers:[{
                latitude:23.362490,
                longitude:116.715790,
            }, {
                latitude:23.37228,
                longitude:116.75498,
            }],
        },
        onLoad: function (options) {
            let that2 = 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='+qqMapKey,
                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])
                    }
                    that2.setData({
                        polyline: [{
                            points: b,
                            color:"#99FF00",
                            width:4,
                            dottedLine:false }],
                    })
                }
            })
        },
    });

url 请求返回的详细信息：

![70][]

返回路线：

![70 1][]

[https_blog.csdn.net_u011330225_article_details_74612620]: https://blog.csdn.net/u011330225/article/details/74612620
[70]: /images/20220525/2b9bb8b9a6284195a67b259ddae9b6f7.png
[70 1]: /images/20220525/4f95b89490e845f5b79d56113ba8250d.png