微信公众号h5实现高德／百度／腾讯地图导航

最近做了个微信公众号h5需求是这样的 1.点击地图进入地图详情 2.地图详情包括开始导航与地图（高德，百度，腾讯）选择，点击开始导航自动跳转该地图app

首先先理一下功能： 1：第一张图是直接显示坐标位置，除了点击进入地图，没有其他的交互，所以就只用了高德地图做的显示； 2：第二张图进入详情，显示坐标位置，点击下面按钮进行高德/百度/腾讯三种地图切换，并且可以进行导航，做导航的话需要进行当前地图定位（定位我用的是微信jssdk）。

说一下高德/百度/腾讯的三种坐标，在进行地图开发过程中，我们一般能接触到以下三种类型的地图坐标系：

1.WGS－84原始坐标系，一般用国际GPS纪录仪记录下来的经纬度，通过GPS定位拿到的原始经纬度，Google和高德地图定位的的经纬度（国外）都是基于WGS－84坐标系的；但是在国内是不允许直接用WGS84坐标系标注的，必须经过加密后才能使用；

2.GCJ－02坐标系，又名“火星坐标系”，是我国国测局独创的坐标体系，由WGS－84加密而成，在国内，必须至少使用GCJ－02坐标系，或者使用在GCJ－02加密后再进行加密的坐标系，如百度坐标系。高德和Google在国内都是使用GCJ－02坐标系，可以说，GCJ－02是国内最广泛使用的坐标系；

3.百度坐标系:bd-09，百度坐标系是在GCJ－02坐标系的基础上再次加密偏移后形成的坐标系，只适用于百度地图。(目前百度API提供了从其它坐标系转换为百度坐标系的API，但却没有从百度坐标系转为其他坐标系的API)

我拿到的后端的数据返回的是wgs-84坐标，在切换成高德/百度/腾讯地图时，我们要根据情况进行坐标转换，否则显示的坐标会有偏移

下面贴下几种坐标转换代码：

下面正式开始进入开发 高德地图定位 百度地图定位 由于调起导航是需要定位的，高德地图给出这样一段话：由于Chrome、IOS10等已不再支持非安全域的浏览器定位请求，为保证定位成功率和精度，请尽快升级您的站点到HTTPS。我们公司现在的域名还是http,所以高德地图定位获取不到。在做百度地图定位的时候，定位返回状态是BMAP_STATUS_SUCCESS成功的，但是定位距离我自己的准确位置相差了几十公里（暂时还没有找到原因），而后采用了微信jsjdk的定位 微信jssdk获取当前用户定位 贴下获取当前定位代码：

高德地图

百度地图

腾讯地图

完整的页面功能实现代码