uniapp打开地图直接获取位置

devtools/2024/9/23 10:35:50/

在这里插入图片描述
uniapp官网文档

https://en.uniapp.dcloud.io/api/location/open-location.html

	<view class="map-content" @click.stop="kilometer(item)"><view class="km">{{item.distance||'0'}}km</view></view>
javascript">	import map from '../../utils/map.js'onLoad() {let that = thislet addressInfo = getApp().globalData.addressInfo;if (addressInfo) {that.addressInfo = addressInfothat.getOilList()} else {//这里是获取地理位置map.loadCity().then(res => {that.addressInfo = getApp().globalData.addressInfothat.getOilList()});}},
// 点击获取地图kilometer(e) {uni.openLocation({longitude: Number(e.lng),latitude: Number(e.lat),name: e.name,address: e.address})},

map.js页面对地理位置进行封装

javascript">
import QQMapWX from '@/utils/qqmap-wx-jssdk.min.js'
var qqmapsdk = {};// 获取位置授权
async function loadCity() {let that = this;return new Promise(function (resolve, reject) {uni.getSetting({success: (res) => {// res.authSetting['scope.userLocation'] == undefined    表示 初始化进入该页面// res.authSetting['scope.userLocation'] == false    表示 非初始化进入该页面,且未授权// res.authSetting['scope.userLocation'] == true    表示 地理位置授权if (res.authSetting['scope.userLocation'] != undefined && res.authSetting['scope.userLocation'] != true) {uni.showModal({title: '请求授权当前位置',content: '需要获取您的地理位置,请确认授权',success: function (res) {if (res.cancel) {uni.showToast({title: '拒绝授权',icon: 'none',duration: 1000})reject(false);} else if (res.confirm) {uni.openSetting({success: function (dataAu) {if (dataAu.authSetting["scope.userLocation"] == true) {uni.showToast({title: '授权成功',icon: 'success',duration: 1000})that.getLocation().then(function (res) {if (res) {resolve(true);} else {reject(false);}});} else {uni.showToast({title: '授权失败',icon: 'none',duration: 1000})reject(false);}}})}}})} else if (res.authSetting['scope.userLocation'] == undefined) {that.getLocation().then(function (res) {if (res) {resolve(true);} else {reject(false);}});} else {that.getLocation().then(function (res) {if (res) {resolve(true);} else {reject(false);}});}}})}).catch((e) => {})
}
//坐标获取城市
function getLocation() {let vm = this;return new Promise(function (resolve, reject) {uni.getLocation({type: 'wgs84',success: function (res) {getApp().globalData.latitude = res.latitude;getApp().globalData.longitude = res.longitude;uni.setStorageSync("longitude", res.longitude)uni.setStorageSync("latitude", res.latitude)vm.getLocal().then(function (res) {if (res) {resolve(true);} else {reject(false);}});},fail: function (res) {reject(false);}})}).catch((e) => {})
}// 坐标转换地址
function getLocal() {let vm = this;return new Promise(function (resolve, reject) {qqmapsdk = new QQMapWX ({key: 'asdfghjklqwertyuiop' //这里自己的key秘钥进行填充});qqmapsdk.reverseGeocoder({location: {latitude: getApp().globalData.latitude,longitude: getApp().globalData.longitude},success: function (res) {getApp().globalData.addressInfo = res.result.address_component;resolve(true);},fail: function (res) {reject(false);}});}).catch((e) => {})
}function calculateDistance(latitude, longitude) {let vm = this;return new Promise(function (resolve, reject) {qqmapsdk = new QQMapWX ({key: 'asdfghjklqwertyuiop' //这里自己的key秘钥进行填充});qqmapsdk.calculateDistance({to: [{latitude: latitude, //商家的纬度longitude: longitude, //商家的经度}],success: function (res) {resolve(res);},fail: function (res) {reject(res);}});}).catch((e) => {})
}function selectLocation() {let that = this;return new Promise(function (resolve, reject) {uni.getSetting({success(res) {// 只返回用户请求过的授权let auth = res.authSetting;if (auth['scope.userLocation']) {// 已授权,申请定位地址resolve(true)} else if (auth['scope.userLocation'] === undefined) {// 用户没有请求过的授权,不需要我们主动弹窗,微信会提供弹窗resolve(true)} else if (!auth['scope.userLocation']) {// 没有授权过,需要用户重新授权// 这个弹窗是为了实现点击,不然openSetting会失败uni.showModal({title: '是否授权当前位置?',content: '需要获取您的地理位置,请确认授权,否则定位功能将无法使用',success: res => {if (res.confirm) {uni.openSetting({success(res) {let setting = res.authSetting;if (!setting['scope.userLocation']) {uni.showToast({title: '地址授权失败,定位功能无法使用',icon: 'none',});reject(false)} else {// 地址授权成功,申请定位地址resolve(true)}},fail(err) {// 需要点击,有时候没有点击,是无法触发openSettingconsole.log('open-setting-fail', err);reject(false)}});}}});}}});}).catch((e) => {})
}module.exports = {loadCity,getLocation,getLocal,getLocation,selectLocation,calculateDistance
}

http://www.ppmy.cn/devtools/91776.html

相关文章

Linux文件系统

目录 前言 一.磁盘的结构 磁盘数据定位方法 CHS定位法 LBA寻址法 二.Linux文件系统 1.文件系统结构 ​编辑 2.inode 通过inode找到文件内容 3.重新理解文件 新建/删除文件 目录文件 软硬链接 前言 Linux文件系统是操作系统中用来组织和管理文件与目录的结构, 它…

2024年6月 青少年python一级等级考试真题试卷

202406 青少年软件编程等级考试Python一级真题 试卷总分数&#xff1a;100分 第 1 题 在使用turtle绘制图形时&#xff0c;如果要控制小海龟移动到 x 坐标为 200&#xff0c;y 坐标为150 的位置&#xff0c;以下代码能够实现效果的是&#xff1f;&#xff08; &#xff09; …

IntelliJ IDEA 打包教程

前言 当你完成了项目的编写&#xff0c;并准备将项目打包成可部署的文件时&#xff0c;IntelliJ IDEA 提供了多种方式来帮助你轻松完成这一任务。本教程将详细介绍如何使用 IntelliJ IDEA 对项目进行打包。 准备工作 在开始之前&#xff0c;请确保你已经安装了以下软件&…

docker和Helm Chart的基本命令和操作

一、docker基本命令和操作 1. docker login【登录】 登录 docker client&#xff0c;登录成功之后会显示 Login Succeeded。 docker login登陆到指定的镜像仓库&#xff0c;docker pull 和 docker push 操作都需要预先执行 docker login 操作&#xff1b; 指令&#xff1a;&a…

1018 Public Bike Management

比较复杂的模拟题&#xff0c;Dijstra和dfs结合&#xff0c;注意记牢回溯算法框架&#xff1a; #include<bits/stdc.h> using namespace std; #define ipair pair<int,int> int cmax,n,sp,m; vector<vector<int>> pre; vector<vector<ipair>…

kubernets学习笔记——使用kubeadm构建kubernets集群及排错

使用kubeadm构建kubernets集群 一、准备工作1、repo源配置&#xff1a;阿里巴巴开源镜像源2、更新软件包并安装必要的系统工具3、同步时间4、禁用selinux5、禁用交换分区swap6、关闭防火墙 二、安装docker-ce、docker、cri-docker1、安装docker-ce2、开启内核转发&#xff0c;转…

基于YOLOv8的船舶检测系统

基于YOLOv8的船舶检测系统 (价格85) 包含 【散货船&#xff0c;集装箱船&#xff0c;渔船&#xff0c;杂货船&#xff0c;矿砂船&#xff0c;客船】 6个类 通过PYQT构建UI界面&#xff0c;包含图片检测&#xff0c;视频检测&#xff0c;摄像头实时检测。 &#xff08;该…

江科大/江协科技 STM32学习笔记P21

文章目录 ADC模数转换器ADC简介逐次逼近型ADCSTM32的ADCADC基本结构输入通道转换模式单次转换&#xff0c;非扫描模式连续转换&#xff0c;非扫描模式单次转换&#xff0c;扫描模式连续转换&#xff0c;扫描模式 触发控制数据对齐转换时间校准硬件电路电位器产生可调电压的电路…