必须使用第三方地图SDK（如高德JS API）并显式开启路况图层才能显示实时路况；需在引入SDK时添加plugin=AMap.RoadInfo参数，初始化后创建AMap.RoadInfo实例并调用show()方法，且地图zoom级别需足够高（通常≥10）。
HTML5 本身不提供实时路况能力
HTML5 的 navigator.geolocation 只能获取用户坐标，iframe 嵌入地图页面（如百度、高德）也不具备 API 级别的路况控制权。真正显示实时路况，必须依赖第三方地图 SDK，且需显式开启路况图层。
高德 JS API 开启实时路况的必要步骤
使用高德地图 Web SDK 是国内最常见方案，但默认不显示路况，需手动加载插件并设置图层：
- 引入 SDK 时必须带
plugin=AMap.RoadInfo参数，例如：https://webapi.amap.com/maps?v=2.0&key=YOUR_KEY&plugin=AMap.RoadInfo - 初始化地图后，需创建
AMap.RoadInfo实例，并调用show()方法；仅靠map.setFeatures(['roadnet'])不起作用 - 路况图层依赖道路网数据，若地图缩放级别过低（如
zoom ），可能无数据返回，建议设为12或更高 - 注意配额：免费版日调用量有限，
AMap.RoadInfo属于独立接口，不包含在基础地图请求中
百度地图 SDK 显示路况的兼容性陷阱
百度地图 JS API 的路况功能叫 BMap.TrafficControl，但它在新版（v3.0+）中已被标记为「废弃」，实际调用会静默失败：
- 若仍使用旧版（v2.0），需确保加载时指定
src="https://api.map.baidu.com/api?v=2.0&ak=YOUR_AK"，v3.0 地址不支持该控件 -
TrafficControl是控件而非图层，只能开关全局路况，无法叠加到自定义覆盖物上，也不能按区域过滤 - 百度已转向推荐「智能交通态势 API」（HTTP 接口），需服务端代理请求，前端直接跨域会失败
路况数据延迟与地理围栏注意事项
所有厂商的实时路况都不是“秒级更新”：高德通常延迟 2–5 分钟，百度约 3–8 分钟，且仅覆盖主干道和城市快速路：
立即学习“前端免费学习笔记（深入）”；
- 不要用
AMap.RoadInfo的回调判断“路况已加载完成”，它只表示插件就绪；真实路况数据需监听roadinfochange事件 - 移动端 WebView 中调用时，若未声明
android:usesCleartextTraffic="true"（Android 9+）或未配置 HTTPS，SDK 可能静默禁用路况请求 - 部分城市（如县级市、高速非联网路段）无采集设备，API 返回空数据但不报错，需主动检查
result.status === 1 && result.data.length > 0
show()，或者 zoom 设成 8 还在等红绿线，结果白屏以为是 API 失效。 
