uniapp调用高德、百度、腾讯地图实现方法

适用于uniapp项目、vue项目以及微信小程序和也适用于普通手机h5应用,大家都可以去试试的
适用于安卓端,ios端
废话不多说,直接上代码

// 点击某个地方,调起下面的方法
			// 方法要传入需要标注地点的纬度latitude,经度longitude,地名name
 toMapAPP(latitude,longitude,name){
 	  let url = "";
 if (plus.os.name == "Android") {//判断是安卓端
 	 plus.nativeUI.actionSheet({//选择菜单 
     title: "选择地图应用",
     cancel: "取消",
     buttons: [{title: "腾讯地图"},{title: "百度地图"}, {title: "高德地图"}]
		}, function(e) {
		switch (e.index) {
		//下面是拼接url,不同系统以及不同地图都有不同的拼接字段
		case 1:
	  //注意referer=xxx的xxx替换成你在腾讯地图开发平台申请的key
     url = `qqmap://map/geocoder?coord=${latitude},${longitude}&referer=xxx`;
		 break;
	     case 2:
	 url = `baidumap://map/marker?location=${latitude},${longitude}&title=${name}&coord_type=gcj02&src=andr.baidu.openAPIdemo`;
		 break;
	     case 3:
	 url = `androidamap://viewMap?sourceApplication=appname&poiname=${name}&lat=${latitude}&lon=${longitude}&dev=0`;
	     break;
		 default:
		 break;
		}
	 if (url != "") {
	  url = encodeURI(url);
	  //plus.runtime.openURL(url,function(e){})调起手机APP应用
  	 plus.runtime.openURL(url, function(e) {
	     plus.nativeUI.alert("本机未安装指定的地图应用");
				     	 });
					    }
					  })
				} else {
	// iOS上获取本机是否安装了百度高德地图,需要在manifest里配置
	// 在manifest.json文件app-plus->distribute->apple->urlschemewhitelist节点下添加
	//(如urlschemewhitelist:["iosamap","baidumap"])  
		plus.nativeUI.actionSheet({
		title: "选择地图应用",
		cancel: "取消",
		buttons: [{title: "腾讯地图"},{title: "百度地图"}, {title: "高德地图"}]
					}, function(e) {
				   switch (e.index) {
						  case 1:
		url = `qqmap://map/geocoder?coord=${latitude},${longitude}&referer=xxx`;
						  break;
						  case 2:
        url = `baidumap://map/marker?location=${latitude},${longitude}&title=${name}&content=${name}&src=ios.baidu.openAPIdemo&coord_type=gcj02`;
						   break;
						   case 3:
		url = `iosamap://viewMap?sourceApplication=applicationName&poiname=${name}&lat=${latitude}&lon=${longitude}&dev=0`;
						   break;
						   default:
						   break;
						   }
			if (url != "")   
		     url = encodeURI(url);
			 plus.runtime.openURL(url, function(e) {
		     plus.nativeUI.alert("本机未安装指定的地图应用");
						  });
						 }
					   })
				     }
				   }
  • 2
    点赞
  • 11
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值