本文出自APICloud官方论坛,

感谢论坛版主 zk.s分享。

 

本期我们系统整理了打开地图的方法,对百度,高德,腾讯,苹果自带地图都进行了整合。

<!DOCTYPE HTML><html><head>    <meta charset="utf-8">    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">    <title>apicloud百度,高德,腾讯,苹果自带地图导航</title></head><body>  <div>    <button id="baidu">打开百度地图</button>    <button id="gaode">打开高德地图</button>    <button id="tencent">打开腾讯地图</button>    <button id="apple">打开苹果地图</button>  </div></body><script type="text/javascript" src="../script/api.js"></script><script type="text/javascript" src="../script/jquery.min.js"></script><script type="text/javascript">apiready = function(){    //百度地图坐标    var dname = "凤凰山";    var lng = "113.857151";//经度    var lat = "22.68097";//纬度
$("#baidu").click(function () { open_bmap(dname, lng, lat); }) $("#gaode").click(function () {
var bd = bd_decrypt(lng, lat); open_amap(dname, bd.lng, bd.lat); }) $("#tencent").click(function () { open_tmap(dname, lng, lat); })
if(api.systemType == "ios") { $("#apple").click(function () { var bd = bd_decrypt(lng, lat); open_pmap(dname, bd.lng, bd.lat); }) }else{ $("#apple").hide(); }
}
//打开百度地图function open_bmap(dname, lng, lat) { var uri = 'baidumap://map/direction?destination=name:'+dname+'|latlng:'+lat+','+lng+'&mode=driving&src=andr.cheyw'; api.openApp({ uri: uri, iosUrl: uri }, function(ret, err) { console.log(JSON.stringify(err)) if(err.msg=="Application not installed" || err.msg=="未找到可执行的应用") { alert("请先安装百度地图"); } });}
//打开高德地图function open_amap(dname, lng, lat) { var uri = 'amapuri://route/plan/?dlat='+lat+'&dlon='+lng+'&dname='+dname+'&dev=0&t=0'; var iosUrl = 'iosamap://path?sourceApplication=cheyw&dlat='+lat+'&dlon='+lng+'&dname='+dname+'&dev=0&t=0'; api.openApp({ uri: uri, iosUrl: iosUrl }, function(ret, err) { console.log(JSON.stringify(err)) if(err.msg=="Application not installed" || err.msg=="未找到可执行的应用") { alert("请先安装高德地图"); } });}
//打开腾讯地图function open_tmap(dname, lng, lat) { var uri = 'qqmap://map/routeplan?type=drive&fromcoord=CurrentLocation&to='+dname+'&tocoord='+lat+','+lng+'&referer=OB4BZ-D4W3U-B7VVO-4PJWW-6TKDJ-WPB77'; api.openApp({ uri: uri, iosUrl: uri }, function(ret, err) { console.log(JSON.stringify(err)) if(err.msg=="Application not installed" || err.msg=="未找到可执行的应用") { alert("请先安装腾讯地图"); } });}
//打开苹果地图function open_pmap(dname, lng, lat) { var uri = 'http://maps.apple.com/?q='+dname+'&daddr='+lat+','+lng+''; api.openApp({ uri: uri, iosUrl: uri }, function(ret, err) { console.log(JSON.stringify(ret)) console.log(JSON.stringify(err)) });}
//百度坐标转高德(传入经度、纬度)function bd_decrypt(bd_lng, bd_lat) { var X_PI = Math.PI * 3000.0 / 180.0; var x = bd_lng - 0.0065; var y = bd_lat - 0.006; var z = Math.sqrt(x * x + y * y) - 0.00002 * Math.sin(y * X_PI); var theta = Math.atan2(y, x) - 0.000003 * Math.cos(x * X_PI); var gg_lng = z * Math.cos(theta); var gg_lat = z * Math.sin(theta); return {lng: gg_lng, lat: gg_lat}}//高德坐标转百度(传入经度、纬度)function bd_encrypt(gg_lng, gg_lat) { var X_PI = Math.PI * 3000.0 / 180.0; var x = gg_lng, y = gg_lat; var z = Math.sqrt(x * x + y * y) + 0.00002 * Math.sin(y * X_PI); var theta = Math.atan2(y, x) + 0.000003 * Math.cos(x * X_PI); var bd_lng = z * Math.cos(theta) + 0.0065; var bd_lat = z * Math.sin(theta) + 0.006; return {bd_lat: bd_lat, bd_lng: bd_lng }}</script></html>

特别注意:
1.高德地图IOS和android的uri是不一样的。
2.不要用api.appInstalled去判断是否安装应用,IOS9以上好像无法检测。
3.仔细看bd_decrypt,bd_encrypt两个方法,别写反。
4.腾讯地图的经纬度和百度的相同,苹果自带地图的经纬度和高德相同。

01-07 06:54
查看更多