uniapp小程序項目獲取位置經(jīng)緯度信息
前言
提示:這里可以添加本文要記錄的大概內(nèi)容:
在實際項目中很多時候我們需要獲取設(shè)備的位置信息,去展示給客戶,或者以位置信息為參數(shù),繼續(xù)向服務(wù)器獲取一些數(shù)據(jù)。接下來以uni-app小程序項目為例來介紹獲取位置信息的思路
提示:以下是本篇文章正文內(nèi)容,下面案例可供參考
一、相關(guān)代碼
- 判斷手機定位是否授權(quán)
// 定位授權(quán) getLocation() { let that = this; // 1、判斷手機定位服務(wù)【GPS】 是否授權(quán) uni.getSystemInfo({ success(res) { console.log("判斷手機定位服務(wù)是否授權(quán):", res); let locationEnabled = res.locationEnabled; //判斷手機定位服務(wù)是否開啟 let locationAuthorized = res.locationAuthorized; //判斷定位服務(wù)是否允許微信授權(quán) if (locationEnabled == false || locationAuthorized == false) { //手機定位服務(wù)(GPS)未授權(quán) uni.showToast({ title: "請打開手機GPS", icon: "none", }); } else { //手機定位服務(wù)(GPS)已授權(quán) // 2、判斷微信小程序是否授權(quán)位置信息 // 微信小程序已授權(quán)位置信息 uni.authorize({ //授權(quán)請求窗口 scope: "scope.userLocation", //授權(quán)的類型 success: (res) => { that.fnGetlocation(); }, fail: (err) => { err = err["errMsg"]; uni .showModal({ content: "需要授權(quán)位置信息", confirmText: "確認授權(quán)", }) .then((res) => { console.log(res); if (res[1]["confirm"]) { uni.openSetting({ success: (res) => { if (res.authSetting["scope.userLocation"]) { // 授權(quán)成功 uni.showToast({ title: "授權(quán)成功", icon: "none", }); that.fnGetlocation(); } else { // 未授權(quán) uni.showToast({ title: "授權(quán)失敗,請重新授權(quán)", icon: "none", }); uni.showModal({ title: "授權(quán)", content: "獲取授權(quán)" + authouName + "失敗,是否前往授權(quán)設(shè)置?", success: function (result) { if (result.confirm) { uni.openSetting(); } }, fail: function () { uni.showToast({ title: "系統(tǒng)錯誤!", icon: "none", }); }, }); } }, }); } if (res[1]["cancel"]) { // 取消授權(quán) uni.showToast({ title: "你拒絕了授權(quán),無法獲得周邊信息", icon: "none", }); } }); }, complete(res) { // console.log('授權(quán)彈框', res); if (res.errMsg == "authorize:ok") { that.fnGetlocation(); } else { uni.showModal({ title: "授權(quán)", content: "獲取授權(quán)" + authouName + "失敗,是否前往授權(quán)設(shè)置?", success: function (result) { if (result.confirm) { uni.openSetting(); } }, fail: function () { uni.showToast({ title: "系統(tǒng)錯誤!", icon: "none", }); }, }); } }, }); } }, }); },
- 判斷小程序是否授權(quán)位置信息 (代碼在上方)
- 定位獲取
// 定位獲取 fnGetlocation() { let that = this; uni.getLocation({ type: "wgs84", //默認為 wgs84 返回 gps 坐標 geocode: "true", isHighAccuracy: "true", accuracy: "best", // 精度值為20m success: function (res) { console.log("定位獲取:", res); let platform = uni.getSystemInfoSync().platform; if (platform == "ios") { //toFixed() 方法可把 Number 四舍五入為指定小數(shù)位數(shù)的數(shù)字。 that.bindList.long = res.longitude.toFixed(6); that.bindList.lat = res.latitude.toFixed(6); } else { that.bindList.long = res.longitude; that.bindList.lat = res.latitude; } that.bindList.longlat = "經(jīng)度" + that.changeTwoDecimal_f(that.bindList.long) + "/" + "緯度" + that.changeTwoDecimal_f(that.bindList.lat); that.getAreaCode(res.latitude, res.longitude); }, fail(err) { if ( err.errMsg === "getLocation:fail 頻繁調(diào)用會增加電量損耗,可考慮使用 wx.onLocationChange 監(jiān)聽地理位置變化" ) { uni.showToast({ title: "請勿頻繁定位", icon: "none", }); } if (err.errMsg === "getLocation:fail auth deny") { // 未授權(quán) uni.showToast({ title: "無法定位,請重新獲取位置信息", icon: "none", }); authDenyCb && authDenyCb(); that.isLocated = false; } if ( err.errMsg === "getLocation:fail:ERROR_NOCELL&WIFI_LOCATIONSWITCHOFF" ) { uni.showModal({ content: "請開啟手機定位服務(wù)", showCancel: false, }); } }, }); },
- 通過經(jīng)緯度坐標獲取區(qū)域碼
// getAreaCode通過經(jīng)緯度(wgs84)坐標獲取區(qū)域碼 getAreaCode(latitude, longitude) { this.$refs.uForm.resetFields(); var that = this; that.$u.api .getAreaCode({ latitude: latitude, longitude: longitude, }) .then((res) => { if (res.code == 100000000) { console.log("通過經(jīng)緯度坐標獲取區(qū)域碼:", res); // console.log(res, 'areaCode'); that.bindList.areaCode = res.data.areaCode; that.bindList.specificAddress = res.data.detailLocation; that.bindList.address = res.data.areaLocation; } else { uni.showToast({ title: res.msg, icon: "none" }); } }) .catch((err) => { this.loadState = "加載失敗err"; console.log("getDevList_err:", err); //-------------------- }); },
二、相關(guān)的數(shù)據(jù)返回
三、效果展示
最后
提示:這里對文章進行總結(jié):
以上就是獲取位置信息的大概步驟思路:
- 判斷手機定位服務(wù)是否授權(quán)(uni.getSystemInfo)
- 判斷小程序是否授權(quán)位置信息(uni.authorize)
- 定位獲?。╱ni.getLocation)
- 通過經(jīng)緯度坐標獲取區(qū)域碼,這是通過以經(jīng)緯度為參數(shù)獲取后端的數(shù)據(jù)
到此這篇關(guān)于uni-app如何獲取位置信息(經(jīng)緯度)的文章就介紹到這了,更多相關(guān)uni-app獲取位置內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
基于Bootstrap的Java開發(fā)問題匯總(Spring MVC)
這篇文章主要為大家匯總了基于Bootstrap的Java開發(fā)問題,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-01-01javascript制作sql轉(zhuǎn)換為stringBuffer的小工具
這篇文章主要介紹了javascript制作sql轉(zhuǎn)換為stringBuffer的小工具,使用方法很簡單,吧寫好的sql語句只要格式化好之后放進去就可以了,推薦給大家,有需要的小伙伴可以參考下。2015-04-04javascript 實現(xiàn)動態(tài)側(cè)邊欄實例詳解
這篇文章主要介紹了javascript 實現(xiàn)動態(tài)側(cè)邊欄實例詳解的相關(guān)資料,并附實例代碼,幫助大家學(xué)習(xí)理解,需要的朋友可以參考下2016-11-11