html5无法自主实现路径规划，必须依赖高德、百度等第三方地图sdk；高德需申请key并使用amap.directionsdriving类，注意坐标解析与配额限制；百度需严格匹配bd09坐标系并处理城市参数；移动端定位偏差大，须结合ip定位或坐标转换校正。
HTML5 本身不提供路径规划能力，必须依赖第三方地图 SDK（如高德、百度、腾讯地图）的 JavaScript API 实现。纯 HTML5 + Geolocation 只能获取位置，无法算路线。
用高德地图 JS API 实现驾车路径规划
这是国内最常用且文档清晰的方案。关键点是引入 AMap.DirectionsDriving 类，它支持起点、终点坐标或地址自动解析。
- 需先在高德开放平台申请 Web 端 Key，并在
<script></script>标签中加载 SDK，带plugin=AMap.DirectionsDriving - 起点终点可用
AMap.Geocoder先转为经纬度，避免直接传地址导致解析失败 -
DirectionsDriving.search()是异步方法，结果在回调里处理，别在外部直接取result.routes[0] - 注意配额限制：免费版每日 1 万次调用，超限后返回
info: "INVALID_USER_KEY"或"OVER_QUOTA"
const driving = new AMap.DirectionsDriving({
policy: AMap.DrivingPolicy.LEAST_TIME // 可选 LEAST_DISTANCE / MOST_COMFORTABLE
});
driving.search([116.481028, 39.989643], [116.475917, 39.981972], (status, result) => {
if (status === 'complete' && result.routes.length) {
console.log('预计耗时：', result.routes[0].time);
}
});
百度地图 API 中步行/公交路径规划的坑
百度的 BMap.WalkingRoute 和 BMap.TransitRoute 对坐标系敏感，容易因坐标偏移导致路线错位或查无结果。
- 务必确认传入的是百度坐标系（BD09），不是 WGS84 或 GCJ02；若用
navigator.geolocation获取的位置，需调用BMap.Convertor.translate()转换 - 公交规划需指定城市名参数，否则可能跨城匹配失败，例如
new BMap.TransitRoute('北京', {city: '北京'}) - 步行路线在城区外可能返回空，API 默认只计算 5km 内路径，超出范围不会报错，但
result.getPlan(0)为null
移动端适配与定位不准问题
在 iOS Safari 或微信 WebView 中，navigator.geolocation.getCurrentPosition() 返回的坐标常有 300–500 米偏差，直接影响路径起点精度。
立即学习“前端免费学习笔记（深入）”；
- 不要直接把 GPS 坐标当起点，建议叠加 IP 定位（如高德
AMap.CitySearch）做粗略校正 - 微信内需调用
wx.getLocation()并设置type: 'wgs84'，再转换为地图 SDK 所需坐标系 - Android Chrome 有时会缓存旧定位，加
enableHighAccuracy: true和timeout: 10000强制刷新
路径规划真正难的不是调接口，而是坐标系对齐、异常兜底和用户真实场景下的容错——比如终点在室内、跨省高速、无信号区重新定位等，这些都得靠业务逻辑补足，SDK 不会替你判断。
