H5端添加定位

最新推荐文章于 2025-04-15 15:53:17 发布

I`ivresse

最新推荐文章于 2025-04-15 15:53:17 发布

阅读量1.6k

点赞数 26

文章标签：大数据

本文链接：https://blog.youkuaiyun.com/Taojia9958/article/details/125842193

版权

本文介绍了在H5端实现地图定位的详细步骤，包括在manifest.json中配置地图API key，使用vue-jsonp进行JSONP请求，以及在main.js中进行相关设置，以获取并显示地理位置信息。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

H5定位地图步骤

1、manifest.json 配置地图key

2、highAccuracyExpireTime: 100,

3、是否能够打印出res,

4、npm install vue-jsonp --save
npm init：初始化

onLoad() {
			/*H5定位地图步骤
			1、manifest.json 配置地图key
			2、highAccuracyExpireTime: 100,
			3.是否能够打印出res,
			4.npm install vue-jsonp --save
			  npm init：初始化
			5.在main.js中配置
			import { VueJsonp } from 'vue-jsonp'
			Vue.use(VueJsonp)
			6.// #ifdef H5
			let url = 'https://apis.map.qq.com/ws/geocoder/v1/'
			let data = {
				location: res.latitude + ',' + res.longitude,
				key: 'NJNBZ-XS33X-WOM4O-ZLIG5-POXA3-ILFJC',
				output: 'jsonp',
				callback: 'jsonp'
			}
			this.$jsonp(url, data).then(res => {
				if (res.status == 0) {