uniapp 展示地图,并获取当前位置信息(精确位置)

news2024/11/7 17:31:10

使用uniapp 提供的map标签 

	  <map :key='mapIndex'  class="container" :latitude="latitude" :longitude="longitude"  ></map>

页面初始化的时候,获取当前的位置信息

		created() {
			
	
				
			let that = this
			uni.getLocation({
				type: 'gcj02',// 火星坐标系
				isHighAccuracy:true,
				geocode:true,
				success: function (res) {
					that.latitude = res.latitude
					that.longitude  = res.longitude
					// 通过经纬度获取位置信息
					that.locationName(res.latitude, res.longitude)
				},fail:function(res){
					console.log()
						uni.showToast({
							title: '获取位置信息失败',
							duration: 2000,
							icon:'error'
						});
				}
			});
			

		},

根据获取到的经纬度 获取 位置信息(此处使用的是 高德地图的位置服务,通过高德地图的逆地理位置解析,获取定位到的经纬度的 位置信息)

			// 定义解析位置信息的方法
			locationName(latitude, longitude) {
				let that = this
				let mapKey = '1d8xxxxxxxxxxxxxxxx'; 
				
				// 构造URL
				var url = 'https://restapi.amap.com/v3/geocode/regeo?key=' + mapKey + '&location=' + longitude + ',' + latitude;
				 
				// 使用fetch发送请求
				fetch(url)
				  .then(response =>  response.json())
				  .then(data => {
				    if (data.status === '1') {
				      // 获取到的地址信息
				      var address = data.regeocode.formatted_address;
					  that.nowAddressInfo = address
					  
				    } else {
				      console.error('Error: ' + data.info);
				    }
				  })
				  .catch(error => console.error('Error:', error));
			},

高德地图获取key

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1819517.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

第三方软件测评公司可提供哪些测试服务类型?

第三方软件测评公司就是由软件研发方、需求方以外的检测单位承担的测试服务&#xff0c;第三方测评公司担任着一个中间公证人的角色&#xff0c;按照合同、相关标准获得公正的测试结论&#xff0c;客观评估软件产品质量&#xff0c;那么第三方软件测评公司可提供哪些测试服务类…

HTML列表和表格标签

目录 1.列表标签 1.1无序列表 1.2有序列表 1.3定义列表 2. 表格标签、 2.1表格标签的属性 2.2合并单元格 1.列表标签 1.1无序列表 <ul>: [type 属性&#xff1a; disc( 实心圆点 )( 默认 ) 、 circle( 空心圆圈 ) 、 square( 实心方块 )] <li>: 列表中…

服务器无法远程桌面连接,解决服务器进行无法远程桌面连接方法有哪些

当服务器无法建立远程桌面连接时&#xff0c;通常涉及多个层面的排查和修复。下面将详细列举一些专业的解决方法&#xff0c;以应对服务器远程桌面连接问题。 一、基础排查与验证 1. 确认网络连通性&#xff1a; - 使用ping命令检查客户端与服务器之间的网络连通性。 - …

3389端口修改工具,修改3389端口的操作

3389端口作为远程桌面协议&#xff08;RDP&#xff09;的默认端口&#xff0c;常常成为黑客攻击的目标。为了提高系统的安全性&#xff0c;修改3389端口成为一项重要的安全措施。本文将详细介绍如何使用3389端口修改工具进行专业操作&#xff0c;以确保系统的安全稳定。 一、备…

跟《经济学人》学英文:2024年6月8日这期:Part 01

本文是对《经济学人》杂志2024.6.8这期的英文学习。 Narendra Modi looks likely to serve a third term as India’s prime minister, after his Bharatiya Janata Party and its allies won a slim majority. The ruling alliance won 293 seats, compared with the opposi…

ios描述文件.mobileprovision 如何查看包含的设备 udid|IPA查看是否包含设备 UDID|轻松签查看证书是否包含自己设备 UDID

前言 之前蒲公英支持上传证书查看证书有效期和包含设备 【干货】IOS苹果P12证书有效性检测 及查看证书是否包含自己的设备 【干货】IOS苹果P12证书有效性检测 及查看证书是否包含自己的设备 - 路灯IT技术博客 - 后厂村路灯 如今蒲公英下架了该功能&#xff0c;已经没有证书检…

环境监控与管理平台

随着全球气候变化的日益严峻&#xff0c;环境监控与管理成为了当代社会不可或缺的重要任务。HiWoo Cloud平台&#xff0c;作为一款环境监控与管理平台&#xff0c;正以其卓越的性能、强大的功能和灵活的部署方式&#xff0c;为各行各业的环保事业提供强有力的技术支撑。 一、H…

Python写UI自动化--playwright(元素定位)

本篇详细分享playwright如何进行打断点、元素定位、填写输入框、点击等操作 目录 一、PyCharm打断点进行调试 二、浏览器开发者模式检查元素 三、通过CSS或XPath进行定位 四、输入框输入文本操作 五、点击操作 总结 一、PyCharm打断点进行调试 如图所示&#xff0c;我们…

高考志愿填报秘籍:大学篇

选择适合自己的大学和专业&#xff0c;对广大考生来说至关重要。从某种程度上来说&#xff0c;决定了考生未来所从事的行业和发展前景。为了帮助广大考生更加科学、合理地填报志愿&#xff0c;选择适合自己的大学和专业&#xff0c;本公众号将推出如何用AI填报高考志愿专栏文章…

vue-element-admin后台集成方案

官网&#xff1a;介绍 | vue-element-adminA magical vue adminhttps://panjiachen.github.io/vue-element-admin-site/zh/guide 1.git环境安装配置及简单操作 1.1git环境安装配置 git软件官网&#xff1a;Git - Downloads (git-scm.com)https://git-scm.com/downloads 下载…

python脚本实现arcgis离散型切片png格式十六进制名称转十进制名称

背景 Arcgis中离散型切片为png格式时,它的名称是十六进制格式的,而Arcgis不支持转为十进制格式的,所有需要自己写一个脚本来转换 效果 脚本 import osdef hex_to_dec(name):return str(int(name, 16))def

以bert为例,了解Lora是如何添加到模型中的

以bert为例,了解Lora是如何添加到模型中的 一.效果图1.torch.fx可视化A.添加前B.添加后 2.onnx可视化A.添加前B.添加后 3.tensorboard可视化A.添加前B.添加后 二.复现步骤1.生成配置文件(num_hidden_layers1)2.运行测试脚本 本文以bert为例,对比了添加Lora模块前后的网络结构图…

【Spine学习06】之IK约束绑定,制作人物待机动画,图表塞贝尔曲线优化动作

引入IK约束的概念&#xff1a; 约束目标父级 被约束骨骼子集 这样理解更好&#xff0c;约束目标可以控制被约束的两个骨骼运作 IK约束绑定过程中呢&#xff0c;如果直接绑定最下面的脚掌骨骼会发生偏移&#xff0c;所以在开始处理IK之前&#xff0c;需要先设置一个ROOT结点下的…

签到的二维码怎么制作?快速实现制作二维码签到的方法

现在很多活动会采用二维码的方式来做登记、报名、签到等&#xff0c;通过二维码可以快速获取用户信息&#xff0c;并且对于用户填写内容也提升了便利性&#xff0c;而且还能够节约成本&#xff0c;通过后台就可以查看用户登记的数据&#xff0c;方便后期的分析和信息管理。 想…

自监督分类网络:创新的端到端学习方法

现代人工智能的快速发展中&#xff0c;分类任务的高效解决方案一直备受关注。今天&#xff0c;我们向大家介绍一种名为Self-Classifier的全新自监督端到端分类学习方法。由Elad Amrani、Leonid Karlinsky和Alex Bronstein团队开发&#xff0c;Self-Classifier通过优化同一样本的…

【机器学习】QLoRA:基于PEFT亲手微调你的第一个AI大模型

目录 一、引言 二、量化与微调—原理剖析 2.1 为什么要量化微调? 2.2 量化&#xff08;Quantization&#xff09; 2.2.1 量化原理 2.2.2 量化代码 2.3 微调&#xff08;Fine-Tuning&#xff09; 2.3.1 LoRA 2.3.2 QLoRA 三、量化与微调—实战演练&#xff1a;以Qwen…

Photoshop 2024 mac/win版:探索图像处理的全新境界

Photoshop 2024是Adobe推出的最新图像处理与设计软件&#xff0c;它在继承了前作所有优秀特性的基础上&#xff0c;实现了多个方面的质的飞跃。这款软件凭借其卓越的图像处理性能、丰富的创意工具以及精确的选区编辑功能&#xff0c;成为了图像处理领域的佼佼者。 Photoshop 2…

Golang免杀-分离式加载器(传参)AES加密

目录 enc.go 生成: dec.go --执行dec.go...--上线 cs生成个c语言的shellcode. enc.go go run .\enc.go shellcode 生成: --key为公钥. --code为AES加密后的数据, ----此脚本每次运行key和code都会变化. package mainimport ("bytes""crypto/aes"&…

redis 08 慢查询日志

1.什么是慢查询日志 2.慢查询和两个参数有关 2.1 2.2 3.例子&#xff1a; 4 参数详细介绍&#xff1a;

共模信号与差模信号

差模信号又称串模信号&#xff0c;指的是两根线之间的信号差值&#xff1b;而共模信号又称对地信号&#xff0c;指的是两根线分别对地的信号。 差模信号&#xff1a;大小相等&#xff0c;方向相反的信号。共模信号&#xff1a;大小相等&#xff0c;方向相同的信号。 对于两输…