uni-app获取位置信息(经纬度转换地址信息)-Toy模板网

这篇具有很好参考价值的文章主要介绍了uni-app获取位置信息(经纬度转换地址信息)。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

uniapp获取位置信息，获取到的信息为经纬度，再通过转换成地址信息

1.使用uni.getLocation()获取位置信息
2.下载qqmap-wx-jssdk.js插件插件下载地址
3.使用腾讯位置服务器对经纬度进行一个地址信息转换(自己创建一个应用即可)
uniapp获取定位位置信息,uniapp,uni-app,javascript,前端
全都勾选上

4.注意！！关键之处！！一定要在微信公众号平台上服务器配置 apis.map.qq.com

uniapp获取定位位置信息,uniapp,uni-app,javascript,前端

上代码
template

<view><button @click="getLocation">获取位置</button></view>

methods: {
		// 获取当前位置
		getLocation() {
			const that = this;
			// 获取位置信息
			uni.getLocation({
				type: 'wgs84',
				success(res) {
					// 经纬度转化地址信息
					const qqmap = require('@/pages/qqmap-wx-jssdk.min.js');
					const showmap = new qqmap({
						key: 'NWSBZ-ZUME4-LLTU6-XSQGB-YBKAT-U4FCZ'
					});
					// 逆地址解析reverseGeocoder
					showmap.reverseGeocoder({
						location: {
							latitude: res.latitude,
							longitude: res.longitude
						},
						success(result) {
							// 地址信息
							const adres = result.result.address;
							that.address = adres;
							console.log(adres);
							// 此处使用的this不是指向vc
							// 所在在头部先获取到this复制给that
						}
					});
				},
				fail(e) {
					let errMsgTit = '';
					if (e.errMsg === 'getLocation:fail auth deny') {
						errMsgTit = '你已拒绝授权，是否跳转至设置页面开启权限';
					} else {
						errMsgTit = '操作频繁提示，建议搭配onLocationChange()使用';
					}
					uni.showModal({
						title: '提示',
						content: `${errMsgTit}`,
						success(res) {
							if (res.confirm) {
								// 获取设置页面权限信息
								uni.getSetting({
									success(res) {
										console.log(res.authSetting);
										// 判断是否开启获取位置权限
										if (!res.authSetting['scope.userLocation']) {
											// 如果没有开启，点击确认后打开设置页面
											uni.openSetting({});
										}
									}
								});
								console.log('用户点击确定');
							} else if (res.cancel) {
								console.log('用户点击取消');
							}
						}
					});
				}
			});
		}
		}