综合路线规划
功能场景
该示例在个性化地图基础上叠加了路况图层,展示了“驾车”、“步行”、“公交”三种类型的路线规划。
DEMO
https://bj.bcebos.com/v1/mapopen/api-demos/video/综合路线规划.mp4
综合路线规划示例
核心接口
类 | 接口 | 描述 | 参考文档 |
Map | map.setTrafficOn(); | 叠加路况 | 暂无 |
DrivingRoute | driving.search(startPoint, endPoint) | 驾车路线规划 | 暂无 |
WalkingRoute | walking.search(start, end) | 步行路线规划 | 暂无 |
TransitRoute | transit.search(startPoint, endPoint); | 公交路线规划 | 暂无 |
核心代码
map.setTrafficOn(); // 叠加路况 var configs = { start: '慈云寺', end: '百度大厦', checkTab: 0, // 出行方式 type: 0 // 路线种类 }; /** * 点击驾车搜索按钮 */ function drivingSearch() { map.clearOverlays(); var start = document.getElementById('srchstart').value; var end = document.getElementById('srchend').value; configs.start = start ? start : configs.start; configs.end = end ? end : configs.end; var geo = new BMapGL.Geocoder(); geo.getPoint(configs.start, function (point) { if (point) { configs.startPoint = point; } else { alert('起点输入不正确,请重新输入。'); } }); geo.getPoint(configs.end, function (point) { if (point) { configs.endPoint = point; } else { alert('终点输入不正确,请重新输入。'); } }); var driving = new BMapGL.DrivingRoute(map, { renderOptions: { map: map, autoViewPort: true } }); driving.search(configs.startPoint, configs.endPoint); // driving.setSearchCompleteCallback(function (rs) { // console.log(rs); // }); } /** * 步行路线 */ function walkingSearch() { map.clearOverlays(); var start = document.getElementById('srchstart').value; var end = document.getElementById('srchend').value; configs.start = start ? start : configs.start; configs.end = end ? end : configs.end; var walking = new BMapGL.WalkingRoute(map, { renderOptions: { map: map, autoViewPort: true } }); walking.search(configs.start, configs.end); // walking.setSearchCompleteCallback(function (rs) { // console.log(rs); // }); } /** * 公交车路线 */ function busSearch() { map.clearOverlays(); var start = document.getElementById('srchstart').value; var end = document.getElementById('srchend').value; configs.start = start ? start : configs.start; configs.end = end ? end : configs.end; var geo = new BMapGL.Geocoder(); geo.getPoint(configs.start, function (point) { if (point) { configs.startPoint = point; } else { alert('起点输入不正确,请重新输入。'); } }); geo.getPoint(configs.end, function (point) { if (point) { configs.endPoint = point; } else { alert('终点输入不正确,请重新输入。'); } }); var transit = new BMapGL.TransitRoute(map, { renderOptions: { map: map, autoViewPort: true } }); transit.search(configs.startPoint, configs.endPoint); }
复制
深色
复制成功