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

uniapp打开地图直接获取位置

在这里插入图片描述
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>
	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页面对地理位置进行封装


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.lryc.cn/news/417807.html

相关文章:

  • Qt的事件处理机制、信号和槽以及两者之间的区别
  • LSTM实战之预测股票
  • 30-50K|抖音大模型|社招3轮面经
  • ChatGPT首次被植入人类大脑:帮助残障人士开启对话
  • 数据结构-常见排序的七大排序
  • 程序员学CFA——财务报告与分析(四)
  • 【消息队列】kafka如何保证消息不丢失?
  • 不同随机数生成的含义
  • Jar工具完全指南:从入门到精通
  • 前端使用docx-preview展示docx + 后端doc转docx
  • Vue3 组件通信
  • 如何在Ubuntu 14.04上安装、配置和部署Rocket.Chat
  • ISO 26262中的失效率计算:IEC TR 62380-Section 15-Switches and keyboards
  • Linux安全与高级应用(五)深入探讨Linux Shell脚本应用:从基础到高级
  • Java中等题-解码方法(力扣)
  • 【Git】git 从入门到实战系列(二)—— Git 介绍以及安装方法
  • 【QT 5 QT 6 构建工具qmake-cmake-和-软件编译器MSVCxxxvs MinGWxxx说明】
  • SD卡参数错误:深度解析与数之寻软件恢复实战
  • 深入理解和应用RabbitMQ的Work Queues模型
  • 嵌入式面试八股文(三)·野指针产生原因和解决方法、指针函数和函数指针的区别
  • OpenCV 中 CV_8UC1,CV_32FC3,CV_32S等参数的含义
  • v 3 + vite + ts 自适应布局(postcss-pxtorem)
  • (MTK)java文件添加简单接口并配置相应的SELinux avc 权限笔记2
  • Linux安全与高级应用(六)Linux Shell脚本编程的高级应用:条件测试与if语句的妙用
  • 升级MacOS(Mojave)后使用git问题
  • 基于PFC和ECN搭建无损RoCE网络的工作流程分析
  • 射频功率放大器调测简略
  • Linux使用docker搭建Redis 哨兵模式
  • springboot给类进行赋初值的四种方式
  • Day32 | 1049. 最后一块石头的重量 II 494. 目标和 474.一和零