我爱模板网 > 建站教程 > APP开发,混合APP >  apiCloud调用百度和高德地图进行导航正文

apiCloud调用百度和高德地图进行导航

我爱模板网在使用apicloud做一个关于二手车的APP时,遇到一个需求:即点击门店地址,调用手机内安装的百度和高德导航软件进行导航,经过百度和自己摸索,总结了下面的代码:

1、由于用到了api.appInstalled来判断手机是否安装了百度和高德APP,而iOS9中系统对检测应用是否安装的方法做了限制,若想得到期望的结果,需要在config.xml里面配置可被检测的URL Scheme。此外,一定要上传代码,然后充电打包自定义loader或者测试版,才能有效果:
<preference name="querySchemes" value="iosamap,baidumap" />
2、html:
<div class="branch-item flex flex-middle" tapmode @click="openmap(117.322131,31.889231,'合肥火车站')">
3、下面是调用导航的js代码:
	//打开地图
	openmap:function(lon,lat,addr){
		var systemType = api.systemType;
		var buttons = new Array();
		var amap_installed = false;
		var bmap_installed = false;
		//判断是否安装了高德和百度地图
		if(systemType=='ios'){
		  var installed = api.appInstalled({
			  sync: true,
			  appBundle:'iosamap://'
		  });
		  if (installed) {
			  amap_installed = true;
			  buttons.push('高德地图');
		  }
		  var installed = api.appInstalled({
			  sync: true,
			  appBundle:'baidumap://'
		  });
		  if (installed) {
			  bmap_installed = true;
			  buttons.push('百度地图');
		  }
		}else{
		  var installed = api.appInstalled({
			  sync: true,
			  appBundle: 'com.autonavi.minimap'
		  });
		  if (installed) {
			  amap_installed = true;
			  buttons.push('高德地图');
		  }
		  var installed = api.appInstalled({
			  sync: true,
			  appBundle: 'com.baidu.BaiduMap'
		  });
		  if (installed) {
			  bmap_installed = true;
			  buttons.push('百度地图');
		  }
		}
		if(bmap_installed==false && amap_installed==false){
		  api.toast({
			msg:'您没有安装任何地图软件'
		  });
		  return false;
		}
		var address = addr;
		var latbaidu = lat;
		var lngbaidu = lon;
		var latgaode = func.bd2gd(lon,lat).lat;
		var lnggaode = func.bd2gd(lon,lat).lng;
		api.actionSheet({
			cancelTitle: '取消',
			buttons: buttons
		}, function(ret, err) {
			var index = ret.buttonIndex;
			if(buttons[index-1]){   //这里要排除‘取消’按钮
				switch (index) {
					case 1:
						//t=0出行方式 0,1,2,3,4  dev是否开发模式
						if(amap_installed && bmap_installed){
							if(systemType=='ios'){
								api.openApp({
									iosUrl: 'iosamap://path?sourceApplication=applicationName&sid=BGVIS1&did=BGVIS2&dlat='+latgaode+'&dlon='+lnggaode+'&dname='+address+'&dev=0&t=0',
								}, function(ret, err) {
								});
							}else{
								api.openApp({
									androidPkg: 'android.intent.action.VIEW',
									uri: 'amapuri://route/plan/?dlat='+latgaode+'&dlon='+lnggaode+'&dname='+address+'&dev=0&t=0'
								}, function(ret, err) {
								});
							}
						}else{
							if(amap_installed){
								if(systemType=='ios'){
									api.openApp({
										iosUrl: 'iosamap://path?sourceApplication=applicationName&sid=BGVIS1&did=BGVIS2&dlat='+latgaode+'&dlon='+lnggaode+'&dname='+address+'&dev=0&t=0',
									}, function(ret, err) {
									});
								}else{
									api.openApp({
										androidPkg: 'android.intent.action.VIEW',
										uri: 'amapuri://route/plan/?dlat='+latgaode+'&dlon='+lnggaode+'&dname='+address+'&dev=0&t=0'
									}, function(ret, err) {
									});
								}
							}
							if(bmap_installed){
								if(systemType=='ios'){
									api.openApp({
										iosUrl: 'baidumap://map/direction?destination=latlng:'+latbaidu+','+lngbaidu+'|name:'+address+'&mode=riding',
									}, function(ret, err) {
										if (err) {
											//alert(JSON.stringify(err));
										}
									});
								}else{
									api.openApp({
										androidPkg: 'android.intent.action.VIEW',
										uri: 'baidumap://map/direction?destination=latlng:'+latbaidu+','+lngbaidu+'|name:'+address+'&mode=riding'
									}, function(ret, err) {

									});
								}
							}
							break;
						}
					case 2:
						if(systemType=='ios'){
							api.openApp({
								iosUrl: 'baidumap://map/direction?destination=latlng:'+latbaidu+','+lngbaidu+'|name:'+address+'&mode=riding',
							}, function(ret, err) {
								if (err) {
									//alert(JSON.stringify(err));
								}
							});
						}else{
							api.openApp({
								androidPkg: 'android.intent.action.VIEW',
								uri: 'baidumap://map/direction?destination=latlng:'+latbaidu+','+lngbaidu+'|name:'+address+'&mode=riding'
							}, function(ret, err) {
								if (err) {
									//alert(JSON.stringify(err));
								}
							});
						}
						break;
				}
			}
		});
	},


部分素材资源来源网站,本站提供免费下载,如有侵权请联系站长马上删除!
上一篇:swiper.js 在IOS中双击上滑或下滑 下一篇:Android和IOS键盘弹起详解
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
选择头像:
最新评论

猜你喜欢