收藏
回答

map组件中polyline绘制出的路线都是两点之间的直线连接,如何实现根据实际道路路线进行绘制呢?

polyline参数中传的是两组经纬度,预期结果是想实现两组起点到终点根据实际道路绘制出的线路,但实际只是绘制出了两点之间的直线路线


回答关注问题邀请回答
收藏

1 个回答

  • Misa
    Misa
    2020-12-18

    解决方案:

    // 获取两组经纬度之间的路径规划

    const getPolyline = (startLat, startLon, endLat, endLon,successCallback) => {

      //网络请求设置

      let opt = {

        //WebService请求地址,from为起点坐标,to为终点坐标,开发key为必填

        url: `https://apis.map.qq.com/ws/direction/v1/walking/?from=${startLat},${startLon}&to=${endLat},${endLon}&key=${qqmapkey}`,

        method: 'GET',

        dataType: 'json',

        //请求成功回调

        success: (res) => {

          console.log('腾讯地图路径请求', res);

          let ret = res.data

          if (ret.status != 0return; //服务异常处理

          let coors = ret.result.routes[0].polyline,

            pl = [];

          //坐标解压(返回的点串坐标,通过前向差分进行压缩)

          let kr = 1000000;

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

            coors[i= Number(coors[i - 2]) + Number(coors[i]) / kr;

          }

          //将解压后的坐标放入点串数组pl中

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

            pl.push({

              latitude: coors[i],

              longitude: coors[i + 1]

            })

          }

          //设置polyline属性,将路线显示出来

          let polyline = [{

            points: pl,

            color: '#1D78F7',

            width: 6,

            arrowLine: true

          }]

          successCallback(polyline);

        }

      };

      wx.request(opt);


    }

    module.exports = {

      getPolyline

    }


    2020-12-18
    有用
    回复
登录 后发表内容
问题标签