转载:https://zhuanlan.zhihu.com/p/429541057
目前常用的地图api,坐标系统基本可以划分为三类。
WGS84(CGCS2000):谷歌地图,OpenStreetMap(OSM),天地图
GCJ02:高德地图、腾讯地图
BD09:百度地图
这三类坐标系统中位置相互有偏差,但地图平台又各自有优点。不同坐标系统的地图平台资源混用的需求,也就非常普遍了。比如mapbox的地图资源,基本是基于OSM的,国内的道路、建筑物信息的丰富程度远远比不上高德和百度。项目中也经常有通过mapbox加载高德、百度地图资源的需求。
demo效果
在线示例:
mapbox 加载高德底图
https://xinbo.work/ma.html
mapbox 加载百度底图
https://xinbo.work/ma.html
源码下载:
https://xinbo.work/mapboxAndAMapBdMap.7z
说明:
源码中mapbox-map 使用注释掉的空白style,就会只显示高德(百度)地图。相当于在高德(百度)矢量底图上使用mapbox的能力,实现纠偏(整合)。
实例中关于延迟的处理方法:
高德地图。immediately 设置成true,可以消除延迟。
百度地图。noAnimation 设置成true,可以消除延迟。
关于延迟的处理,因为文章的评论里有很多人相关的问题及处理方法。多废话几句说下自己对延迟的理解,地图api的延迟本质上是动画的过渡,降低地图突变带来的视觉上的突兀。实例中的方法其实是最简单、粗暴的一种方式,直接取消了动画。个人在实际应用中,更喜欢的解决方案,是在整合中间加一层,模拟原始高德、百度api的地图动效,实现差不多的动效。