這篇文章是對微信小程序在關(guān)閉的情況下依然可以獲取定位信息的方法簡介

主要步驟

1.添加配置

2.開啟定位追蹤

3.開始記錄

添加配置

json配置

注：此配置在基礎(chǔ)庫2.8之后開始支持

小程序基礎(chǔ)庫分配占比

"requiredBackgroundModes": ["location"],
"permission": {
	"scope.userLocation": {
		"desc": "你的位置信息將用于小程序位置展示效果"
	}
}

app.json 的配置是實(shí)現(xiàn)小程序后臺更新定位的關(guān)鍵

配置后設(shè)置中如圖：會多出新的選項(xiàng)，選擇后及時(shí)在息屏的時(shí)候也可以監(jiān)聽定位點(diǎn)的變化

視圖層配置

map組件官網(wǎng)文檔： 鏈接

<map markers="{{markers}}" polyline="{{polyline}}" longitude="{{longitude}}" latitude="{{latitude}}"></map>

邏輯層配置

data: {
	longitude: '',   // 地圖定位點(diǎn)經(jīng)度
	latitude: '',    // 地圖定位點(diǎn)緯度
	markers: [],	 // 記錄軌跡起、終點(diǎn)坐標(biāo)
	polyline: [],	 // 軌跡路線；
	positionArr: []
}

在視圖層和邏輯層配置軌跡記錄必要的信息：

1.longitude, latitude 地圖中顯示出當(dāng)前定位點(diǎn)坐標(biāo)

2.markers , 記錄軌跡起、終點(diǎn)坐標(biāo)

3.polyline , 軌跡路線記錄；

開啟定位追蹤

開啟后臺定位模式、發(fā)起授權(quán)申請

授權(quán)申請：

可以根據(jù)wx.getSetting(Object object)向用戶發(fā)起授權(quán)請求，但只要用戶不小心拒絕授權(quán)之后就彈不出授權(quán)請求的框框了。

wx.startLocationUpdateBackground({
	success: res => {
            //打標(biāo)記，后臺定位模式已開啟；
        },
	fail: err => {
            wx.showModal({content: "快去設(shè)置"})
        }
})

所以建議采用選擇直接調(diào)用接口開啟小程序后臺更新定位結(jié)合getsetting的方式；

如果調(diào)用失敗，而且setting API返回的授權(quán)列表location的未授權(quán)則表示用戶未授權(quán)。引導(dǎo)用戶自己在設(shè)置中打開授權(quán)；

開始記錄

確定起始坐標(biāo)

拿到定位信息授權(quán)之后，獲取當(dāng)前位置信息

wx.getLocation({
	success: res => {  }
});

獲取位置信息后，根據(jù)返回的經(jīng)緯度更新邏輯層中的1.longitude, latitude。2.markers

效果如圖：

監(jiān)聽位置變化信息

wx.offLocationChange()
wx.onLocationChange(res => {
	const { latitude, longitude } = res;
})

注意：開啟監(jiān)聽前，建議先關(guān)閉監(jiān)聽。避免同時(shí)開啟多個監(jiān)聽，導(dǎo)致數(shù)據(jù)錯亂。

按照規(guī)則收集定位點(diǎn)信息

位置變更信息約1s獲取一次?？梢宰约禾砑佣〞r(shí)或計(jì)數(shù)機(jī)制將獲取數(shù)據(jù)頻率降低；

即使添加定時(shí)機(jī)制也不能降低接口返回的頻率，但是可以有效降低異常定位點(diǎn)的概率；

每10次提取一次位置信息，例：

let count = 0;
onLocationChange(res => {
	count > 10 && (count = 0)
	count == 0 && positionArr.push([longitude,latitude])
	count++;
})

有效數(shù)據(jù)檢測

對每次提取的信息和positionArr中的最后一條坐標(biāo)數(shù)據(jù)進(jìn)行比對

// 封裝獲取兩個坐標(biāo)點(diǎn)距離方法；
getDistance(lat1, lng1, lat2, lng2) {
	return distance
},

如果數(shù)據(jù)達(dá)標(biāo)則push到positionArr中

活動軌跡渲染

getPolyline() {
	const polyline = [];
	positionArr.forEach(item => {
		..........
	})
	return polyline
}

每一次添加完最新的坐標(biāo)點(diǎn)之后都要重新渲染活動軌跡

結(jié)束軌跡跟蹤

當(dāng)結(jié)束軌跡跟蹤的時(shí)候：

1、把結(jié)束時(shí)的坐標(biāo)點(diǎn)更新到markers當(dāng)中作為終點(diǎn)標(biāo)記；

2、更新活動軌跡

至此結(jié)束

wx.offLocationChange()
positionArr.push([longitude,latitude])
getPolyline()

注意：offLocationChange沒有回調(diào)方法，而且是同步執(zhí)行。（不要輕信文檔）

切記添加關(guān)閉監(jiān)聽定位的機(jī)制，避免再不需要定位的時(shí)候依然監(jiān)聽記錄，影響性能。

引入高德地圖API

如果需要記錄每個定位點(diǎn)的位置信息，小程序支持引入高德的api。有空閑的可以看看了解

入門指南

總結(jié)

到此這篇關(guān)于微信小程序記錄用戶移動軌跡的文章就介紹到這了,更多相關(guān)小程序用戶移動軌跡內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評論