RidingRoute
构造函数
创建骑行路线规划实例
参数 类型 说明 locationstring | Point | Map检索区域，可以是地图实例、坐标点或城市名称字符串 opts可选RidingRouteOptions可选参数 属性 类型 说明 onInfoHtmlSetFunction标注气泡内容创建后的回调函数 onMarkersSetFunction标注添加完成后的回调函数，参数为起终点 POI 数组 onPolylinesSetFunction路线折线添加完成后的回调函数，参数为折线覆盖物数组 onResultsHtmlSetFunction结果列表创建后的回调函数 onSearchCompleteFunction检索完成后的回调函数 renderOptionsRouteRenderOptions结果呈现设置 返回值 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
返回最近一次检索的结果
返回值 RidingRouteResult
返回状态码
返回值 ServiceStatus
发起骑行路线检索
参数 类型 说明 startstring | Point | LocalResultPoi起点，可以是关键字、坐标点或 LocalResultPoi 实例 endstring | Point | LocalResultPoi终点，可以是关键字、坐标点或 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 | Point | Map地图实例、坐标点或城市名称字符串 返回值 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'));
});
设置路线折线的样式，配置项会增量合并到 renderOptions.polylineStyle， 并立即刷新已经绘制在地图上的折线，无需重新检索
参数 类型 说明 stylePolylineOptions折线样式配置 属性 类型 说明 clipboolean是否进行跨经度180度裁剪，绘制跨经度180度的折线时可设置为 false 以优化效果 coordType"BMAP_COORD_BD09" | "BMAP_COORD_GCJ02" | "BMAP_COORD_WGS84"输入坐标的坐标类型。未设置时使用全局 BMap.coordType。 dashArraynumber[]虚线样式配置，如 [8, 4] 表示实线部分长8像素、间隙部分长4像素。 默认虚线中实线和空隙的长度均为线宽的2倍 enableClickingboolean是否响应点击事件 enableEditingboolean是否启用线编辑 enableMassClearboolean是否在调用 map.clearOverlays() 时清除此覆盖物 geodesicboolean是否开启大地线模式，为 true 时两点连线将以大地线的形式呈现 iconsIconSequence[]配置贴合折线的图标 linkRightboolean跨180度经线时是否按最短路径绘制 strokeColorstring折线颜色，格式为 '#xxxxxx'，默认跟随主题色（CSS 变量 --bmap-color-primary，缺省为 '#1677ff'） strokeLineCap"round" | "butt" | "square"描边线端头类型 strokeLineJoin"round" | "miter" | "bevel"描边线连接处类型 strokeOpacitynumber折线的透明度，取值范围0 - 1，默认值为 1 strokeStyle"solid" | "dashed" | "dotted"折线的样式 strokeTexture{ height?: number; url: string; width?: number }线纹理配置，用于沿折线重复绘制图片（如方向箭头），仅 WebGL 渲染模式支持 strokeWeightnumber折线的宽度，以像素为单位，默认值为 2 zIndexnumber覆盖物的初始层叠顺序，也可在实例上通过 setZIndex() 方法修改 返回值 void
示例代码1
ridingRoute.setPolylineStyle({
strokeColor: '#1677ff',
strokeWeight: 8,
highlight: { strokeColor: '#ff4d4f' },
});
设置结果列表创建后的回调函数
参数 类型 说明 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());
});
骑行路线规划服务类，用于获取两点间的骑行出行方案。 适用于地图应用中的骑行导航、共享单车路线展示等场景，可将检索结果自动渲染为地图上的路线和标注，或通过面板展示详细方案列表。