百度地图绘制途径点/分段绘制路线

百度地图绘制途径点

百度地图Api地址:
https://lbsyun.baidu.com/

公司项目中要求绘制物流信息,需体现途径点
但是我在其中没有找到有关绘制路线,设定途径点的相关说明

有一个非官方方法:给 search方法的第三个参数传一个waypoints对象, 其中middlePoints为标点的数组:(途径点貌似并不生效)

      //途经点方式化路线:
       driving.search(startPoint, endPoint, {
    waypoints: middlePoints })

但是这个方法并不精准,由于没找到相关官方说明,也没深入考究,效果如下:

计算路线并未完全经过途径点

于是我们换一种思路

分段绘制路线

多次执行 driving.search(startPoint, endPoint)

      for (let i = 0; i < middlePoints.length; i++) {
   
        if (i === 0) {
   
          driving.search(startPoint, middlePoints[i])
        } else {
   
          driving.search(middlePoints[i - 1], middlePoints[i])
        }
      }
      driving.search(middlePoints[middlePoints.length - 1], endPoint)

但是这时就需要运用到更底层一点的函数
链接: 百度地图jsapi 类参考

在路线的构造函数里面,绘制途径点的每一段路线,并修改样式等等

最终详细代码如下:

		//点的坐标值
	    var gps = [
          {
   lng: 125.532203,lat: 43.715047},
          {
   lng: 123.545295,lat: 42.009887}