uni-app传入地址打开地图获取定位

女爷i 2022-11-04 00:52 261阅读 0赞

**planningRoute.js**

function openMapRoute(lat,lon,cityName) {
    	var url = '';
    	if (plus.os.name == 'Android') {
    		var hasBaiduMap = plus.runtime.isApplicationExist({
    			pname: 'com.baidu.BaiduMap',
    			action: 'baidumap://'
    		});
    		var hasAmap = plus.runtime.isApplicationExist({
    			pname: 'com.autonavi.minimap',
    			action: 'androidamap://'
    		});
    		var urlBaiduMap = 'baidumap://map/marker?location=' + lat + ',' + lon + '&title=' + cityName + '&src=源应用';
    		var urlAmap = 'androidamap://viewMap?sourceApplication=源应用&poiname=' + cityName + '&lat=' + lat + '&lon=' + lon +
    			'&dev=0';
    		if (hasAmap && hasBaiduMap) {
    			plus.nativeUI.actionSheet({
    				title: '选择地图应用',
    				cancel: '取消',
    				buttons: [{
    					title: '百度地图'
    				}, {
    					title: '高德地图'
    				}]
    			}, function(e) {
    				switch (e.index) {
    					case 1:
    						plus.runtime.openURL(urlBaiduMap);
    						break;
    					case 2:
    						plus.runtime.openURL(urlAmap);
    						break;
    				}
    			});
    		} else if (hasAmap) {
    			plus.runtime.openURL(urlAmap);
    		} else if (hasBaiduMap) {
    			plus.runtime.openURL(urlBaiduMap);
    		} else {
    			url = 'geo:' + lat + ',' + lon + '?q=%e6%95%b0%e5%ad%97%e5%a4%a9%e5%a0%82';
    			plus.runtime.openURL(url); //如果是国外应用，应该优先使用这个，会启动google地图。这个接口不能统一坐标系，进入百度地图时会有偏差
    		}
    	} else {
    		// iOS上获取本机是否安装了百度高德地图，需要在manifest里配置，在manifest.json文件app-plus->distribute->apple->urlschemewhitelist节点下添加（如urlschemewhitelist:["iosamap","baidumap"]）
    		plus.nativeUI.actionSheet({
    			title: '选择地图应用',
    			cancel: '取消',
    			buttons: [{
    				title: 'Apple地图'
    			}, {
    				title: '百度地图'
    			}, {
    				title: '高德地图'
    			}]
    		}, function(e) {
    			switch (e.index) {
    				case 1:
    					url = 'http://maps.apple.com/?q=%e6%95%b0%e5%ad%97%e5%a4%a9%e5%a0%82&ll=' + lat + ',' + lon +
    						'&spn=0.008766,0.019441';
    					break;
    				case 2:
    					url = 'baidumap://map/marker?location=' + lat + ',' + lon + '&title=' + cityName + '&src=源应用';
    					break;
    				case 3:
    					url = 'iosamap://viewMap?sourceApplication=源应用&poiname=' + cityName + '&lat=' + lat + '&lon=' + lon + '&dev=0';
    					break;
    				default:
    					break;
    			}
    			if (url != '') {
    				plus.runtime.openURL(url, function(e) {
    					plus.nativeUI.alert('本机未安装指定的地图应用');
    				});
    			}
    		});
    	}
    }
    // 获取地址坐标,注入坐标,开启地图
    export default function addressCoordinates(cityName) {
    	plus.maps.Map.geocode(
    		cityName,
    		event => {
    			var address = event.address; // 转换后的地理位置
    			var point = event.coord; // 转换后的坐标信息
    			var coordType = event.coordType; // 转换后的坐标系类型
    			// 注入
    			openMapRoute(point.latitude, point.longitude,cityName)
    		},
    		e => {
    			var address = e.address; // 转换后的地理位置
    			var point = e.coord; // 转换后的坐标信息
    			var coordType = e.coordType; // 转换后的坐标系类型
    			// 注入
    			openMapRoute(point.latitude, point.longitude,cityName)
    		}
    	);
    }

**enterprise.vue**

1.先导入

import planningRoute from '@/static/utils/planningRoute.js'

2.调用

planningRoute(address){
    	planningRoute(address)
    }

发表评论取消回复

表情：

评论列表（有 0 条评论，261人围观）

还没有评论，来说两句吧...

相关阅读

相关 uniapp如何获取IP地址

js获取 <script src="http://pv.sohu.com/cityjson?ie=utf-8"></script> <script type=

今天药忘吃喽~/ 2023年10月09日 14:26/ 0 赞/ 24 阅读

相关 uniapp-打开第三方地图

//打开第三方地图 export function toMapAPP(latitude, longitude, name) { let url =

小鱼儿/ 2023年01月03日 12:59/ 0 赞/ 333 阅读

相关 uni-app传入地址打开地图获取定位

planningRoute.js function openMapRoute(lat,lon,cityName) { var url = '';

女爷i/ 2022年11月04日 00:52/ 0 赞/ 262 阅读

相关 vue + 百度地图地址搜索并定位

1、先上效果图 ![在这里插入图片描述][20210525163315669.gif_pic_center] 2、实现方法： <el-input v-mo

Dear 丶/ 2022年10月15日 13:57/ 0 赞/ 478 阅读

相关百度地图api搜索地址定位

[下载地址][Link 1]百度地图api地址搜索定位示例，选择公司名称地图上显示对应地址 ![1630441297.png][] dd: [Link 1]: http

向右看齐/ 2022年09月09日 12:47/ 0 赞/ 486 阅读

相关 uniapp 区域地图

<template> <view class="map-content"> <view class="map" id="map"></view>

刺骨的言语ヽ痛彻心扉/ 2022年09月02日 12:54/ 0 赞/ 401 阅读

相关腾讯地图发送定位-打开定位功能

用到的是腾讯地图API，主要的功能： 1.选择地址发送（地图选址组件 [https://lbs.qq.com/tool/component-picker.html][http

素颜马尾好姑娘i/ 2022年03月22日 12:52/ 0 赞/ 425 阅读

相关百度地图上单击获取地址

<style> allmap{width:100%;height:240px;} p{margin-left:5px; font-siz

秒速五厘米/ 2022年03月12日 08:38/ 0 赞/ 421 阅读

相关 uniapp中获取当前设备的经纬度（定位）

效果图： ![20210306202826292.gif][] 实现代码： <template> <view> <block v-i

àì夳堔傛蜴生んèń/ 2021年07月25日 14:06/ 0 赞/ 2925 阅读

相关 uniapp 地图

使用: <map longitude="经度" latitude="纬度" markers="标记点"

缺乏、安全感/ 2021年07月24日 16:43/ 0 赞/ 738 阅读