百度地圖（12）-路徑規划

1. 百度地圖的路徑規划分為四類：駕駛、交通工具、騎行、步行。每個調用不同的函數，雖說是不同的函數，但是使用方法

    基本相同。

　DrivingRoute、TransitRoute、WalkingRoute、RidingRoute。

 

2. 駕駛模式

        routing = new BMap.DrivingRoute(map,{
          renderOptions :{
            map:map,
            autoViewport: true
          }
        });

 

3. 交通工具模式

交通工具還牽涉到跨省時，以飛機優先還是動車優先，具體可以參考具體類。https://mapopen-pub-jsapi.bj.bcebos.com/jsapi/reference/jsapi_reference_3_0.html#a7b9

  routing = new BMap.TransitRoute(map,{
          renderOptions :{
            map:map,
            autoViewport: true
          },
          intercityPolicy:BMAP_INTERCITY_POLICY_EARLY_START,

          transitTypePolicy:BMAP_TRANSIT_TYPE_POLICY_AIRPLANE

        });

TransitPolicy

此常量表示市內公交方案換乘策略。

常量	描述
BMAP_TRANSIT_POLICY_RECOMMEND	推薦方案
BMAP_TRANSIT_POLICY_LEAST_TIME	最少時間
BMAP_TRANSIT_POLICY_LEAST_TRANSFER	最少換乘
BMAP_TRANSIT_POLICY_LEAST_WALKING	最少步行
BMAP_TRANSIT_POLICY_AVOID_SUBWAYS	不乘地鐵
BMAP_TRANSIT_POLICY_FIRST_SUBWAYS	優先地鐵

IntercityPolicy

此常量表示跨城公交換乘策略。

常量	描述
BMAP_INTERCITY_POLICY_LEAST_TIME	時間短
BMAP_INTERCITY_POLICY_EARLY_START	出發早
BMAP_INTERCITY_POLICY_CHEAP_PRICE	價格低

TransitTypePolicy

此常量表示跨城交通方式策略。

常量	描述
BMAP_TRANSIT_TYPE_POLICY_TRAIN	火車優先
BMAP_TRANSIT_TYPE_POLICY_AIRPLANE	飛機優先
BMAP_TRANSIT_TYPE_POLICY_COACH	大巴優先

 

4. 騎行模式

  routing = new BMap.RidingRoute(map,{
          renderOptions :{
            map:map,
            autoViewport: true
          }
        });

 

5. 步行模式

   routing = new BMap.WalkingRoute(map,{
          renderOptions :{
            map:map,
            autoViewport: true
          }
        });

 

6. 路徑規划

 routing.search(startPt,endPt);

調用search函數后，地圖默認會將規划路徑顯示出來。

 

7. 自定義起點和終點圖標，修改路線顏色。

startPt 和 endPt 是在地圖上點擊獲取的 Point 對象。startMarker 和 endMarker 為自定義圖標的兩個點，單獨添加到地圖上。

setPolylinesSetCallback 中執行的代碼，先獲取到已產生的路線並刪除，然后根據路線的點集合，重新畫線 Polyline ，並給顏色賦值。

 var startIcon = new BMap.Icon('/bdMap/img/start.png', new BMap.Size(60,60));

    var endIcon = new BMap.Icon('/bdMap/img/end.png', new BMap.Size(48,48));

    var startMarker = new BMap.Marker(startPt,{icon:startIcon});


    var endMarker = new BMap.Marker(endPt,{icon:endIcon});


    routing.search(startPt,endPt);

    let routeResult = routing.getResults();

    console.log(routeResult);

    routing.setPolylinesSetCallback(function (result) {
      routing.clearResults();
      map.clearOverlays();

      map.addOverlay(startMarker);
      map.addOverlay(endMarker);

      var points = [];
      result[0].Ar.map(function (item) {
        points.push(new BMap.Point(item.lng,item.lat));
      });
      var polyline = new BMap.Polyline(points,{strokeColor:"#ff5943",strokeWeight:5,strokeOpacity:0.5});
      map.addOverlay(polyline);
    });

 

8. 頁面顯示

 

 

9. 代碼參考

https://github.com/WhatGIS/bdMap