百度地图之路线规划

1,430 阅读2分钟

这是我参与8月更文挑战的第5天,活动详情查看:8月更文挑战

DrivingRoute

  • 创建一个驾车导航实例

    1. 当参数为地图实例时,检索位置由地图当前的中心点确定。
    2. 当参数为坐标时,检索位置由该点所在位置确定。
    3. 当参数为城市名称时,检索会在该城市内进行。
  • search(start: Point | LocalResultPoi, end: Point | LocalResultPoi),发起检索。

    1. start: 起点,参数可以是坐标点和LocalSearchPoi实例。
    2. end: 终点,参数可以是坐标点或LocalSearchPoi实例
  • getResults() 得到最新一次的返回结果

  • clearResults() 清除结果

  • onSearchComplete (Function) 检索完成后的回调函数。参数: results

    var map = new BMapGL.Map("container");
    map.centerAndZoom(new BMapGL.Point(116.404, 39.915), 11);

    var p1 = new BMapGL.Point(116.301934,39.977552);
    var p2 = new BMapGL.Point(116.508328,39.919141);

    var driving = new BMapGL.DrivingRoute(map, {renderOptions:{map: map, autoViewport: true}});
    driving.search(p1, p2);

Snipaste_2021-08-05_10-58-38.png

步行导航检

  • WalkingRoute 创建一个步行导航实例。
    1. 当参数为地图实例时,检索位置由当前地图中心点确定
    2. 当参数为坐标时,检索位置由该点所在位置确定
    3. 当参数为城市名称时,检索会在该城市内进行
  • start 起点
  • end 终点
var map = new BMapGL.Map("allmap");
map.enableScrollWheelZoom();
map.centerAndZoom(new BMapGL.Point(116.404, 39.915), 11);
var walking = new BMapGL.WalkingRoute(map, {renderOptions:{map: map, autoViewport: true}});
walking.search('西单', '国贸');

Snipaste_2021-08-05_11-03-51.png

公交线路查询

  • BusLineSearch 和WalkingRoute 类似的进行搜索
  • renderOptions
    1. 第一个参数 map 展现结果的地图实例,当指定此参数后,搜索结果的标注、线路等均会自动添加到此地图上
    2. panel (String | HTMLElement ) 结果列表的HTML容器id或容器元素,提供此参数后,结果列表将在此容器中进行展示。此属性对LocalCity无效。驾车路线规划无效
  • onGetBusListComplete 设置公交列表查询后的回调函数

Snipaste_2021-08-05_11-15-26.png

 var map = new BMapGL.Map("container");            // 创建Map实例
    map.centerAndZoom(new BMapGL.Point(116.404, 39.915), 12);

    var busline = new BMapGL.BusLineSearch(map,{
        renderOptions:{map:map,panel:"r-result"},
        onGetBusListComplete: function(result){
            if(result) {
                var fstLine = result.getBusListItem(0);//获取第一个公交列表显示到map上
                busline.getBusLine(fstLine);
            }
        }
    });
    function busSearch(){
        var busName = 425;
        busline.getBusList(busName);
    }
    setTimeout(function(){
        busSearch();
    },1500);