Open the map on the H5 page of the mobile phone & open the third-party map in the APP

H5 method

Because h5 is a webpage on the mobile phone, you can open an address through window.open(url), and carry the end address for navigation at the same time

//        地图类型  {经纬度}   地址
getMapApp(mapType, location, address) {
			const { lat, lng } = location;
			let url = '';
			switch (mapType) {
				case '腾讯地图':
					url =
						'https://apis.map.qq.com/uri/v1/marker?marker=coord:' +
						lat +
						',' +
						lng +
						';addr:' +
						address +
						';title:地址&referer=keyfree';
					break;
				case '高德地图':
					url =
						'https://uri.amap.com/marker?position=' +
						lng +
						',' +
						lat +
						'&name=' +
						address +
						'&callnative=1';
					break;
				case '百度地图':
					url =
						'http://api.map.baidu.com/marker?location=' +
						lat +
						',' +
						lng +
						'&title=地址&content=' +
						address +
						'&output=html&src=webapp.reformer.appname&coord_type=gcj02';
					break;
				default:
					break;
			}
			return url;
		}

// 通过window.open的方式打开页面
window.open(this.getMapApp('高德地图',{lat:'37.73605',lng:'112.56566'},'怡和广场'))

App method

The app needs to judge whether it is a mobile phone or not, and then judge whether there is this app on the user's mobile phone. If not, it will prompt, and if so, open the app, and at the same time, open the navigation from the user's location to the destination through the destination address and latitude and longitude

// 通过选中哪个地图来进行操作   1为高德  0为百度
// 传参 对象形式  {lat: 纬度,lng: 经度, add: 地址}
onSelect(index) {
	// console.log(index)
	this.navgatorshow = false;
	if (!plus) return;
	if (index) {
		if (plus.runtime.isApplicationExist({ pname: 'com.autonavi.minimap' })) {
			//判断本机是否存在该应用
			this.Gaode({ lat: '37.73605', lng: '112.56566', add: '怡和广场' });
		} else {
			this.$toast('请安装地图后再使用');
		}
	} else {
		if (plus.runtime.isApplicationExist({ pname: 'com.baidu.BaiduMap' })) {
			this.Baidu({ lat: '37.73605', lng: '112.56566', add: '怡和广场' });
		} else {
			this.$toast('请安装地图后再使用');
		}
	}
},
Gaode(options) {
	let { lat, lng, add } = options; //终点的纬度,终点的经度,终点的名称
	let url = `amapuri://route/plan/?sid=BGVIS1&slat=&slon=&sname=&did=BGVIS2&dlat=${lat}&dlon=${lng}&dname=${add}&dev=1&t=0`;
	plus.runtime.openURL(url);
},
Baidu(options) {
	let { lat, lng, add } = options; //终点的纬度,终点的经度,终点的名称
	let url = `bdapp://map/direction?origin=&destination=name:${add}|latlng:${lat},${lng}&coord_type=wgs84&mode=driving&src=andr.baidu.openAPIdemo`;
	plus.runtime.openURL(url);
},

Guess you like

Origin blog.csdn.net/weixin_52615140/article/details/128305963