URI API是为开发者提供直接调起第三方地图产品(Web地图、地图手机客户端)以满足特定业务场景下应用需求的程序接口,开发者只需按照接口规范构造一条标准的URI,便可在PC和移动端浏览器或移动开发应用中调起第三方地图产品,进行地图展示和检索、线路查询、导航等功能,无需进行复杂的地图功能开发。
一、百度地图URI API
地图调起API,官方连接地址:http://lbsyun.baidu.com/index.php?title=uri
a、实现原理
在百度地图的清单文件中对主页面设置了
android:scheme="baidumap" android:host="map" 属性.指定了接受Uri的scheme为baidumap,host为map。当接收到指定Uri后,在主界面中对Uri进行解析和业务拆分,实现功能的调用。 其中 native:scheme为baidumap,host为map web:scheme为bdapp,host为map
b、使用方法
第三方APP在使用该类型接口时,手机中需要安装Android百度地图,同时需要拼写符合协议规范的Uri串,通过srartActivity的方式进行调用。示例如下
Intent i1 = new Intent(); // 驾车导航 i1.setData(Uri.parse("baidumap://map/navi?query=故宫")); startActivity(i1); //网页应用调起Android百度地图方式举例 <a href="bdapp://map/navi?query=故宫">驾车导航a>
二、高德地图URI API
地图调起API,官方连接地址:http://lbs.amap.com/api/amap-mobile/summary/
如果您需要在浏览器中打开高德地图App,例如在H5页面中跳转到高德地图App,或者在本地App中加载的H5页面跳转到高德地图App,需要使用scheme调用,在H5中的链接中加入高德地图的Scheme即可,如(以导航为例):
导航
如果您需要在本地App中打开高德地图App,这种场景即在本地App中通过Java代码调用高德地图页面功能,此时就需要使用 Intent调用。同样以导航功能为例:
Intent intent = new Intent();
intent.setAction(Intent.ACTION_VIEW);
intent.addCategory(Intent.CATEGORY_DEFAULT);
//将功能Scheme以URI的方式传入data
Uri uri = Uri.parse("androidamap://navi?sourceApplication=appname&poiname=fangheng&lat=36.547901&lon=104.258354&dev=1&style=2");
intent.setData(uri);
//启动该页面即可
startActivity(intent);
三、腾讯地图URI API
地图调起URI,官方链接地址:http://lbs.qq.com/uri_v1/index.html
已支持: Web / Wap 版腾讯地图产品,即将支持:Android / iOS版腾讯地图。
四、苹果地图
http://maps.apple.com/?daddr=San+Francisco,+CA&saddr=cupertino
详细官方接口说明:
https://developer.apple.com/library/ios/featuredarticles/iPhoneURLScheme_Reference/MapLinks/MapLinks.html
五、谷歌地图对于Android,是通过Intent形式打开Native Map.
Intent intent=new Intent(Intent.ACTION_VIEW);
String url = "https://maps.google.com/maps?q=31.207149,121.593086(金科路)&z=17&hl=en";
Uri uri = Uri.parse(url);
intent.setData(uri);
startActivity(intent);
详细官方Intent接口说明:
http://developer.android.com/guide/components/intents-common.html#Maps
六、JS调用示例代码 nav.js
//获取浏览器信息
var browser = {
ua : function() {
var u = navigator.userAgent;
var isChrome = u.match(/Chrome\/([\d.]+)/)
|| u.match(/CriOS\/([\d.]+)/);
var isAndroid = u.match(/(Android);?[\s\/]+([\d.]+)?/);
var iosVersion = function() {
if (/iP(hone|od|ad)/.test(navigator.platform)) {
var v = (navigator.appVersion).match(/OS (\d+)_(\d+)_?(\d+)?/);
return [ parseInt(v[1], 10), parseInt(v[2], 10),
parseInt(v[3] || 0, 10) ];
}
}();
var chromeVersion = function() {
var chrome = navigator.userAgent.match(/Chrome\/(\d+)\./);
if (chrome) {
return parseInt(chrome[1], 10);
}
}();
var ios9 = iosVersion && iosVersion[0] >= 9;
var chrome18 = isChrome && isAndroid && chromeVersion
&& chromeVersion > 18;
return { // 移动终端浏览器版本信息
trident : u.indexOf('Trident') > -1, // IE内核
presto : u.indexOf('Presto') > -1, // opera内核
webKit : u.indexOf('AppleWebKit') > -1, // 苹果、谷歌内核
gecko : u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, // 火狐内核
mobile : !!u.match(/AppleWebKit.*Mobile.*/), // 是否为移动终端
iOS : !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), // ios终端
android : u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, // android终端或uc浏览器
iPhone : u.indexOf('iPhone') > -1, // 是否为iPhone或者QQHD浏览器
iPad : u.indexOf('iPad') > -1, // 是否iPad
webApp : u.indexOf('Safari') == -1, // 是否web应该程序,没有头部与底部
weChat : u.indexOf('MicroMessenger') > -1,
UC : u.indexOf('UCBrowser') > -1,
u3 : u.indexOf('U3') > -1,
chrome : u.indexOf('Chrome') > -1,
windowsPhone : u.indexOf("Windows Phone") > -1,
samsung : u.indexOf("Samsung") > -1,
QQ : (u.match(/\sQQ/i) != null ? u.match(/\sQQ/i).toLowerCase() == " qq"
: false),
isChrome : isChrome,
isAndroid : isAndroid,
iosVersion : iosVersion,
chromeVersion : chromeVersion,
ios9 : ios9,
chrome18 : chrome18
};
}()
}
var ua = browser.ua;
// 打开地图App,开始导航
function openMapApp(lat, lng, addr) {
// 地图uri api数组
var uri = new Array();
if (ua.android) {
// 百度地图uri api
uri[0] = "bdapp://map/navi?location=" + lat + "," + lng + "&query="
+ addr;
// 高德地图uri api
uri[1] = "androidamap://navi?sourceApplication=xlwx&poiname=" + addr
+ "&lat=" + lat + "&lon=" + lng + "&dev=1&style=2";
// 腾讯地图uri api
uri[2] = "qqmap://map/marker?marker=coord:" + lat + "," + lng
+ ";title:" + addr + "&referer=xlwx";
} else if (ua.iOS) {
// 百度地图uri api
uri[0] = "baidumap://map/navi?location=" + lat + "," + lng + "&query="
+ addr;
// 高德地图uri api
uri[1] = "iosamap://navi?sourceApplication=xlwx&poiname=" + addr
+ "&lat=" + lat + "&lon=" + lng + "&dev=1&style=2";
// 腾讯地图uri api
uri[2] = "qqmap://map/marker?marker=coord:" + lat + "," + lng
+ ";title:" + addr + "&referer=xlwx";
// 苹果地图uri api
uri[3] = "http://maps.apple.com/?sll=" + lat + "," + lng + "&address="
+ addr;
}
//调用uri
if(uri.length == 0){
return;
}
window.location.href = uri[0];
//启动定时器time1
var time1 = setTimeout(function() {
// 若启动应用,则js会被中断较长时间,超出此范围
window.location.href = uri[1];
}, 2000);
//启动定时器time2
var time2 = setTimeout(function() {
// 若启动应用,则js会被中断较长时间,超出此范围
window.location.href = uri[2];
}, 4000);
//清除定时器
window.beforeunload = function() {
if(time1 != null){
clearTimeout(time1);
}
if(time2 != null){
clearTimeout(time2);
}
}
window.pagehide = function() {
if(time1 != null){
clearTimeout(time1);
}
if(time2 != null){
clearTimeout(time2);
}
}
window.onblur = function() {
if(time1 != null){
clearTimeout(time1);
}
if(time2 != null){
clearTimeout(time2);
}
}
}
完!!!