当前位置: 首页 > news >正文

uni-app 获取当前位置的经纬度以及地址信息

文章目录

    • uni.getLocation(objc)
    • 获取经纬度和地址
    • 调试结果
    • 问题

uni-app 获取当前位置的经纬度以及地址信息

uni.getLocation(objc)

uni-app官方文档定位API: uni.getLocation(OBJECT)

uni.getLocation({type: 'wgs84',success: function (res) {console.log('当前位置的经度:' + res.longitude);console.log('当前位置的纬度:' + res.latitude);}
});

获取经纬度和地址

  1. 去高德开放平台注册账号,添加应用,申请个AppKey

  2. 设置

1)配置勾选系统定位和高德定位,配置高德的“用户名”和“app key”
在这里插入图片描述

2)添加定位权限
在这里插入图片描述
<uses-permission android:name="android.permission.LOCATION"/>

  1. 上代码
<template><view class="container"><text class="title">定位示例</text><button @click="getLocation">获取经纬度</button><view v-if="location"><text>纬度: {{ location.latitude }}</text><text>经度: {{ location.longitude }}</text><text>速度: {{ location.speed }} m/s</text><text>精度: {{ location.accuracy }} m</text></view><view v-if="address"><text>位置: {{ address.formatted_address }} </text></view><view v-if="error"><text>错误信息: {{ error.message }}</text></view></view>
</template><script>
export default {data() {return {location: null,address: null,error: null};},methods: {getLocation() {uni.getLocation({type: 'wgs84',success: (res) => {this.location = {latitude: res.latitude,longitude: res.longitude,speed: res.speed,accuracy: res.accuracy,};this.reverseGeocode(res.latitude,res.longitude);console.log('定位成功:', res);},fail: (err) => {this.error = err;console.error('定位失败:', err);}});},// 逆地理编码函数reverseGeocode(latitude, longitude) {const key = '46XXXXXXXXXXXXXXXXXXXXXX0a'; // 换成你自己的AppKeyconst url = `https://restapi.amap.com/v3/geocode/regeo?key=${key}&location=${longitude},${latitude}`;uni.request({url: url,method: 'GET',success: (res) => {if (res.statusCode === 200 && res.data.status === '1') {this.address = {formatted_address: res.data.regeocode.formatted_address,};console.log(res.data.regeocode);} else {console.error('逆地理编码失败:', res.data);}},fail: (error) => {console.error('请求失败:', error);}});}},onLoad() {this.getLocation();}
};
</script><style>
.container {padding: 20px;
}.title {font-size: 20px;font-weight: bold;margin-bottom: 20px;
}button {margin-bottom: 20px;
}text {display: block;margin-bottom: 10px;
}
</style>

1)先调用uni.getLocation(objc) 函数可以拿到经纬度信息
2)再调用高德地图你地理编码的API获取经纬度对应的地址信息。

调试结果

在Safari上可以获取到经纬度和位置信息:

在这里插入图片描述

在Chrome上调试获取不到;

打包apk手机上也可以获取到经纬度和位置信息。

问题

1)uni.getLocation(objc) 这个函数有一个参数geocode

在这里插入图片描述
App上支持这个方法直接获取地址信息,需要设置 geocode 位 true,同时type参数需要设置成gcj02。

    getLocation() {uni.getLocation({type: 'gcj02',geocode: true,success: (res) => {this.location = {latitude: res.latitude,longitude: res.longitude,speed: res.speed,accuracy: res.accuracy,address: res.address,};console.log('定位成功:', res);},fail: (err) => {this.error = err;console.error('定位失败:', err);}});},

我试了试,手机打包可以获取到经纬度,但是位置信息没拿到,不知道是哪里的配置问题,示例如下:

在这里插入图片描述

在这里插入图片描述

相关文章:

uni-app 获取当前位置的经纬度以及地址信息

文章目录 uni.getLocation(objc)获取经纬度和地址调试结果问题 uni-app 获取当前位置的经纬度以及地址信息 uni.getLocation(objc) uni-app官方文档定位API: uni.getLocation(OBJECT) uni.getLocation({type: wgs84,success: function (res) {console.log(当前位置的经度&…...

【CSS】尺寸单位

在 CSS 中&#xff0c;常见的尺寸单位有以下几种&#xff1a; 像素&#xff08;px&#xff09;&#xff1a; 这是最常用的绝对单位。例如 width: 200px; 表示宽度为 200 像素。像素是固定的尺寸&#xff0c;不会随着屏幕分辨率或设备的不同而变化。 备注&#xff1a; 在不同的…...

Agent(智能体)和 MetaGPT,一句话实现整个需求应用代码

前面 2 篇文章&#xff0c;我们使用文生文、文生图和文生音频三个大模型共同实现了图文并茂的儿童绘本故事和绘本故事音频需求&#xff1a; 第一篇 根据主题生成儿童绘本故事&#xff1a;GLM-4-Flash 大模型 API 免费了&#xff0c;手把手构建“儿童绘本”应用实战&#xff08…...

[数据结构] 哈希结构的哈希冲突解决哈希冲突

标题&#xff1a;[C] 哈希结构的哈希冲突 && 解决哈希冲突 水墨不写bug 目录 一、引言 1.哈希 2.哈希冲突 3.哈希函数 二、解决哈希冲突 1.闭散列 I&#xff0c;线性探测 II&#xff0c;二次探测 2.开散列 正文开始&#xff1a; 一、引言 哈希表是一种非常实用而…...

Wimdows使用Appium IOS自动化

启动appium服务器&#xff1a; appium -a 127.0.0.1 -p 4724 配置 { "platformName": "iOS", "appium:platformVersion": "16.5.1", "appium:deviceName": "(★StatTrak™) |午夜黑&#xff08;崭新出厂&#…...

C语言深度剖析--不定期更新的第四弹

哈哈哈哈哈哈&#xff0c;今天一天两更&#xff01; void关键字 void关键字不能用来定义变量&#xff0c;原因是void本身就被编译器解释为空类型&#xff0c;编译器强制地不允许定义变量 定义变量的本质是&#xff1a;开辟空间 而void 作为空类型&#xff0c;理论上不应该开…...

【手撕数据结构】八大排序神功(上)

目录 冒泡排序【有点拉胯】动图演示:思路解析单趟算法图解代码详解性能优化复杂度分析 直接插入排序【还阔以】动图演示思路解析代码分析与讲解复杂度分析 希尔排序【有点强】动图演示思路讲解排序过程总览代码分析讲解复杂度分析 堆排序【太有石粒啦】动图演示堆的概念与结构向…...

【2024高教社杯全国大学生数学建模竞赛】B题模型建立求解

目录 1问题重述1.1问题背景1.2研究意义1.3具体问题 2总体分析3模型假设4符号说明&#xff08;等四问全部更新完再写&#xff09;5模型的建立与求解5.1问题一模型的建立与求解5.1.1问题的具体分析5.1.2模型的准备 目前B题第一问的详细求解过程以及对应论文部分已经完成&#xff…...

OpenHarmony鸿蒙开发( Beta5.0)智能手表应用开发实践

样例简介 本项目是基于BearPi套件开发的智能儿童手表系统&#xff0c;该系统通过与GSM模块&#xff08;型号&#xff1a;SIM808&#xff09;的通信来实现通话和定位功能。 智能儿童手表系统可以通过云和手机建立连接&#xff0c;同步时间和获取天气信息&#xff0c;通过手机下…...

共享单车轨迹数据分析:以厦门市共享单车数据为例(一)

共享单车数据作为交通大数据的一个重要组成部分&#xff0c;在现代城市交通管理和规划中发挥着越来越重要的作用。通过对共享单车的数据进行深入分析&#xff0c;城市管理者和规划者能够获得大量有价值的洞察&#xff0c;这些洞察不仅有助于了解城市居民的日常出行模式&#xf…...

SprinBoot+Vue在线商城微信小程序的设计与实现

目录 1 项目介绍2 项目截图3 核心代码3.1 Controller3.2 Service3.3 Dao3.4 application.yml3.5 SpringbootApplication3.5 Vue3.6 uniapp代码 4 数据库表设计5 文档参考6 计算机毕设选题推荐7 源码获取 1 项目介绍 博主个人介绍&#xff1a;CSDN认证博客专家&#xff0c;CSDN平…...

4--SpringBootWeb-请求响应

目录 postman 1.简单参数 请求参数名与形参变量名一致时 请求参数名与形参变量名不一致时 2.实体参数 简单实体对象 复杂实体对象 3.数组集合参数 数组 集合 4.日期参数 5.JSON参数 6.路径参数 1 2 postman Postman值一款功能强大的网页调试与发送网页HTTP请求的…...

电脑点击关机之后,又自动重启开机了。根本就关不了?

前言 有个小姐姐说&#xff0c;她家的电脑好生奇怪&#xff1a;点击【关机】按钮之后&#xff0c;电脑提示【正在关机】&#xff0c;过了几秒&#xff0c;电脑又自动开机了…… 好家伙&#xff01;也就是说关机和重启根本就没区别&#xff0c;电脑完全无法断电。 最后忍无可…...

强化网络安全:通过802.1X协议保障远程接入设备安全认证

随着远程办公和移动设备的普及&#xff0c;企业网络面临着前所未有的安全挑战。为了确保网络的安全性&#xff0c;同时提供无缝的用户体验&#xff0c;我们的 ASP 身份认证平台引入了先进的 802.1X 认证协议&#xff0c;确保只有经过认证的设备才能接入您的网络。本文档将详细介…...

链动2+1模式AI智能名片S2B2C商城小程序源码在社群商业价值构建中的应用探索

摘要&#xff1a;在数字经济浪潮的推动下&#xff0c;社群作为商业生态的核心组成部分&#xff0c;其商业价值正以前所未有的速度增长。本文深入探讨了如何通过“链动21模式AI智能名片S2B2C商城小程序源码”这一前沿技术工具&#xff0c;深度挖掘并优化社群的商业价值。通过详细…...

基于SpringBoot+Vue+MySQL的校园周边美食探索及分享平台

系统背景 在当今数字化时代&#xff0c;校园生活正日益融入信息技术的浪潮之中&#xff0c;学生们对于便捷、高效且富有趣味性的生活方式有着越来越高的追求。特别是在饮食文化方面&#xff0c;随着校园周边餐饮业态的日益丰富&#xff0c;学生们渴望一个能够集美食探索、分享与…...

“设计模式双剑合璧:工厂模式与策略模式在支付系统中的完美结合”

工厂模式&#xff08;Factory Pattern&#xff09;和策略模式&#xff08;Strategy Pattern&#xff09;都是常见的设计模式&#xff0c;但它们解决的问题和应用场景不同。下面是它们的区别&#xff1a; 1. 目的不同&#xff1a; 工厂模式&#xff08;Factory Pattern&#xf…...

第二百一十九节 JPA 教程 - JPA 字段映射示例

JPA 教程 - JPA 字段映射示例 当将 Java bean 字段映射到数据库列时&#xff0c;我们可以选择标记字段&#xff0c;标记 getter 方法并标记两者。 标记字段 以下代码来自 Professor.java。 它显示如何将主键列标记为 Java bean 字段标识。 package cn.w3cschool.common; im…...

目标检测-YOLOv6

YOLOv6 YOLOv6 是 YOLO 系列的一个新版本&#xff0c;相比 YOLOv5 进行了大量的优化与改进。YOLOv6 的设计目标是在提高模型检测精度的同时&#xff0c;进一步优化速度和效率&#xff0c;特别是在推理速度和部署便捷性方面。它采用了更先进的网络架构和优化技巧&#xff0c;在…...

Java面向对象与多态

目录 Java面向对象与多态 多态介绍 形成多态的前提 多态下成员访问的特点 成员变量 成员方法 访问特点总结 多态对比普通继承 普通继承优点与缺点 多态优点与缺点 向上转型与向下转型 向下转型存在的问题 多态接口练习 Java面向对象与多态 多态介绍 在前面学习到…...

谷歌浏览器插件

项目中有时候会用到插件 sync-cookie-extension1.0.0&#xff1a;开发环境同步测试 cookie 至 localhost&#xff0c;便于本地请求服务携带 cookie 参考地址&#xff1a;https://juejin.cn/post/7139354571712757767 里面有源码下载下来&#xff0c;加在到扩展即可使用FeHelp…...

React19源码系列之 事件插件系统

事件类别 事件类型 定义 文档 Event Event 接口表示在 EventTarget 上出现的事件。 Event - Web API | MDN UIEvent UIEvent 接口表示简单的用户界面事件。 UIEvent - Web API | MDN KeyboardEvent KeyboardEvent 对象描述了用户与键盘的交互。 KeyboardEvent - Web…...

python爬虫:Newspaper3k 的详细使用(好用的新闻网站文章抓取和解析的Python库)

更多内容请见: 爬虫和逆向教程-专栏介绍和目录 文章目录 一、Newspaper3k 概述1.1 Newspaper3k 介绍1.2 主要功能1.3 典型应用场景1.4 安装二、基本用法2.2 提取单篇文章的内容2.2 处理多篇文档三、高级选项3.1 自定义配置3.2 分析文章情感四、实战案例4.1 构建新闻摘要聚合器…...

vue3 定时器-定义全局方法 vue+ts

1.创建ts文件 路径&#xff1a;src/utils/timer.ts 完整代码&#xff1a; import { onUnmounted } from vuetype TimerCallback (...args: any[]) > voidexport function useGlobalTimer() {const timers: Map<number, NodeJS.Timeout> new Map()// 创建定时器con…...

涂鸦T5AI手搓语音、emoji、otto机器人从入门到实战

“&#x1f916;手搓TuyaAI语音指令 &#x1f60d;秒变表情包大师&#xff0c;让萌系Otto机器人&#x1f525;玩出智能新花样&#xff01;开整&#xff01;” &#x1f916; Otto机器人 → 直接点明主体 手搓TuyaAI语音 → 强调 自主编程/自定义 语音控制&#xff08;TuyaAI…...

QT: `long long` 类型转换为 `QString` 2025.6.5

在 Qt 中&#xff0c;将 long long 类型转换为 QString 可以通过以下两种常用方法实现&#xff1a; 方法 1&#xff1a;使用 QString::number() 直接调用 QString 的静态方法 number()&#xff0c;将数值转换为字符串&#xff1a; long long value 1234567890123456789LL; …...

selenium学习实战【Python爬虫】

selenium学习实战【Python爬虫】 文章目录 selenium学习实战【Python爬虫】一、声明二、学习目标三、安装依赖3.1 安装selenium库3.2 安装浏览器驱动3.2.1 查看Edge版本3.2.2 驱动安装 四、代码讲解4.1 配置浏览器4.2 加载更多4.3 寻找内容4.4 完整代码 五、报告文件爬取5.1 提…...

论文笔记——相干体技术在裂缝预测中的应用研究

目录 相关地震知识补充地震数据的认识地震几何属性 相干体算法定义基本原理第一代相干体技术&#xff1a;基于互相关的相干体技术&#xff08;Correlation&#xff09;第二代相干体技术&#xff1a;基于相似的相干体技术&#xff08;Semblance&#xff09;基于多道相似的相干体…...

网站指纹识别

网站指纹识别 网站的最基本组成&#xff1a;服务器&#xff08;操作系统&#xff09;、中间件&#xff08;web容器&#xff09;、脚本语言、数据厍 为什么要了解这些&#xff1f;举个例子&#xff1a;发现了一个文件读取漏洞&#xff0c;我们需要读/etc/passwd&#xff0c;如…...

CSS | transition 和 transform的用处和区别

省流总结&#xff1a; transform用于变换/变形&#xff0c;transition是动画控制器 transform 用来对元素进行变形&#xff0c;常见的操作如下&#xff0c;它是立即生效的样式变形属性。 旋转 rotate(角度deg)、平移 translateX(像素px)、缩放 scale(倍数)、倾斜 skewX(角度…...