现在很多人都喜欢旅游，无论是家人自驾游，还是朋友穷游，亦或者是情侣之间的双人游，都离不开路线图，提前规划好出行路线，会使旅行方便快乐。那么怎么样才能制作出一份完美的路线图呢？很多人都想要在出行前制作路线图，但是具体该如何操作呢？下面我就来简单介绍一下如何利用百度地图制作出行路线图
，希望能帮助你哦！
材料/工具
电脑/百度地图
方法
打开电脑，在桌面上找到360安全浏览器的图标，双击打开
在搜索框中输入“百度地图”，点击“搜索”按钮。
点击进入百度地图官网。
点击首页右上角的“工具箱”。
然后点击“标记”。
这时候鼠标成了小棍的形状，点击你的出发点，也就是出行起点。
在“添加标记”中输入相关信息，点击“保存”，添加第一个标记成功。
点击如图图标，可以做其他标记。
然后也是点击保存即可。
你可以做几个标记，起点，中途经过的地方，以及终点，都可以标记。
标记好地点后，点击 “标记”小窗口 的 第二个图标，如图所示
依次点击你刚才设置的地点标记，双击完成地点的连接。
就这样一个完整的出行路线图已大功告成了，你只需要保存下来即可，下次出行的时候方便查看。
React使用百度地图实现驾车路线规划
1、创建基本地图
<Map center={{ lng, lat }} zoom="11" style={{ height: '39vh'}} enableScrollWheelZoom ref={this.mapRef}> </Map>
2、实现驾车规划
const driving = new BMapGL.DrivingRoute(this?.mapRef?.current?.map, { renderOptions:{map: this?.mapRef?.current?.map, autoViewport: true} });driving.search(start, end);
3、计算驾车时间和距离
const driving = new BMapGL.DrivingRoute(this?.mapRef?.current?.map, { renderOptions:{map: this?.mapRef?.current?.map, autoViewport: true}, onSearchComplete: (results: any) => { if (driving.getStatus() != BMAP_STATUS_SUCCESS){ return ; } const plan = results.getPlan(0); this.setState({ planTime: plan.getDuration(true), //获取时间 planDistance: plan.getDistance(true) //获取距离 }) });driving.search(start, end);
4、修改起点和终点图标
const driving = new BMapGL.DrivingRoute(this?.mapRef?.current?.map, { renderOptions:{map: this?.mapRef?.current?.map, autoViewport: true}, onMarkersSet: (result: any) => { const startIcon = new BMapGL.Icon(carPng, new BMapGL.Size(69.6, 40)); const endIcon = new BMapGL.Icon(hospitalPng, new BMapGL.Size(85, 59)); result[0].marker.setIcon(startIcon); result[0].marker.setTitle(current?.vidId ?? '起点'); result[result.length - 1].marker.setIcon(endIcon); result[result.length - 1].marker.setTitle(current?.orgName ?? '终点'); } }); driving.search(start, end);
