RidingRoute

用于获取骑行路线规划方案。

构造函数

  • 创建骑行路线规划实例

    参数类型说明
    locationstring检索区域,可以是地图实例、坐标点或城市名称字符串
    opts 可选RidingRouteOptions可选参数
    属性类型说明
    onInfoHtmlSetFunction标注气泡内容创建后的回调函数
    onMarkersSetFunction标注添加完成后的回调函数,参数为起终点 POI 数组
    onPolylinesSetFunction路线折线添加完成后的回调函数,参数为折线覆盖物数组
    onResultsHtmlSetFunction结果列表创建后的回调函数
    onSearchCompleteFunction检索完成后的回调函数
    renderOptionsRenderOptions结果呈现设置

    返回值 RidingRoute

    示例代码1

    // 设置 renderOptions.map,路线和标注自动渲染到地图上
    const ridingRoute = new BMap.RidingRoute(map, {
    renderOptions: { map: map, autoViewport: true },
    onSearchComplete(results) {
    console.log('路线已自动绘制到地图');
    },
    });
    ridingRoute.search('北京大学', '清华大学');

    示例代码2

    // 设置展示面板 + viewportOptions.margins 避免面板遮挡路线聚焦区域
    const ridingRoute = new BMap.RidingRoute(map, {
    renderOptions: {
    map: map,
    panel: 'route-panel',
    autoViewport: true,
    viewportOptions: { margins: [20, 20, 20, 300] },
    },
    onSearchComplete(results) {
    console.log('路线已绘制,结果面板已展示');
    },
    });
    ridingRoute.search('北京大学', '清华大学');

    示例代码3

    // 纯回调用法,不自动渲染到地图
    const ridingRoute = new BMap.RidingRoute(map, {
    onSearchComplete(results) {
    if (ridingRoute.getStatus() === 0) {
    const plan = results.getPlan(0);
    console.log('骑行距离:', plan.getDistance(true));
    }
    },
    });

方法

  • 清除最近一次检索的结果,同时清除地图上的路线和标注

    返回值 void

  • 禁用自动调整地图视野

    返回值 void

  • 启用自动调整地图视野

    返回值 void

  • 发起骑行路线检索

    参数类型说明
    startstring起点,可以是关键字、坐标点或 LocalResultPoi 实例
    endstring终点,可以是关键字、坐标点或 LocalResultPoi 实例

    返回值 void

    示例代码1

    ridingRoute.search('北京大学', '清华大学');
    ridingRoute.search(new BMap.Point(116.391, 39.910), new BMap.Point(116.431, 39.931));
  • 设置气泡打开后的回调函数

    参数类型说明
    callback(poi: LocalResultPoi, html: HTMLElement) => void回调函数

    返回值 void

    示例代码1

    ridingRoute.setInfoHtmlSetCallback((poi, html) => {
    console.log(poi.title, html.innerHTML);
    });
  • 设置检索区域

    参数类型说明
    locationstring地图实例、坐标点或城市名称字符串

    返回值 void

    示例代码1

    ridingRoute.setLocation('北京');
    
  • 设置标注添加完成后的回调函数

    参数类型说明
    callback(pois: LocalResultPoi[]) => void回调函数,参数为起终点 POI 数组

    返回值 void

    示例代码1

    ridingRoute.setMarkersSetCallback((pois) => {
    pois.forEach(poi => console.log(poi.title));
    });
  • 设置路线折线添加完成后的回调函数

    参数类型说明
    callback(polylines: Polyline[]) => void回调函数,参数为折线覆盖物数组

    返回值 void

    示例代码1

    ridingRoute.setPolylinesSetCallback((polylines) => {
    polylines.forEach(pl => pl.setStrokeColor('orange'));
    });
  • 设置结果列表创建后的回调函数

    参数类型说明
    callback(container: HTMLElement) => void回调函数

    返回值 void

    示例代码1

    ridingRoute.setResultsHtmlSetCallback((container) => {
    document.getElementById('results').appendChild(container);
    });
  • 设置检索结束后的回调函数

    参数类型说明
    callback(results: RidingRouteResult) => void回调函数

    返回值 void

    示例代码1

    ridingRoute.setSearchCompleteCallback((results) => {
    console.log('方案数:', results.getNumPlans());
    });