WeChatアプレットがユーザーの移動軌跡を記録

この記事では、WeChatミニプログラムが閉じている場合でも位置情報を取得する方法について簡単に紹介します。

主な手順

1. 設定を追加する

2. 位置追跡を有効にする

3. 録音を開始する

設定を追加

json 構成

注: この構成は基本ライブラリ 2.8 以降でサポートされます。

ミニプログラム基本ライブラリ割り当て比率

"必須背景モード": ["場所"],
"許可"： {
	"スコープ.userLocation": {
		"desc": "あなたの位置情報はミニプログラムの位置表示効果に使用されます"
	}
}

app.jsonの設定は、ミニプログラムのバックグラウンド更新配置を実現するための鍵です。

設定後、設定は図のようになります。新しいオプションが表示されます。それらを選択すると、画面がオフの場合でも位置決めポイントの変更を監視することができます。

レイヤー構成の表示

マップコンポーネントの公式ウェブサイトのドキュメント: リンク

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

論理層の構成

データ： {
	longitude: '', // マップ位置ポイントの経度 latitude: '', // マップ位置ポイントの緯度 markers: [], // トラックの開始点と終了点の座標を記録します polyline: [], // トラックのルート;
	位置Arr: []
}

ビュー層とロジック層でトラック記録に必要な情報を設定します。

1. 経度、緯度地図には現在地の座標が表示されます

2. マーカー、トラックの開始点と終了点の座標を記録する

3.ポリライン、トラックルート記録。

位置追跡をオンにする

バックグラウンド測位モードを有効にし、認証リクエストを開始する

認可申請:

wx.getSetting(Object object) に従ってユーザーへの認可要求を開始できますが、ユーザーが誤って認可を拒否した場合、認可要求ボックスはポップアップ表示されません。

wx.startLocationUpdateBackground({
	成功: res => {
            //マーク、背景配置モードがオンになっています。
        },
	失敗: エラー => {
            wx.showModal({content: "設定へ移動"})
        }
})

したがって、getsetting と組み合わせてアプレットのバックグラウンド更新配置を開始するインターフェイスを直接呼び出すことをお勧めします。

呼び出しが失敗し、設定 API によって返された承認リストの場所が承認されていない場合は、ユーザーが承認されていないことを意味します。ユーザーが設定で認証をオンにするようにガイドします。

録音を開始

開始座標を決定する

位置情報の認証を取得後、現在の位置情報を取得します

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

位置情報を取得したら、返された経度と緯度に従って論理レイヤーの 1.longitude、latitude を更新します。 2. マーカー

効果は以下のようになります。

位置情報の変更情報をリッスンする

wx.offLocationChange()
wx.onLocationChange(res => {
	const { 緯度、経度 } = res;
})

注意: 監視をオンにする前に、まず監視をオフにすることをお勧めします。データの混乱を避けるため、複数のモニターを同時に開かないようにしてください。

ルールに従って測位ポイント情報を収集する

位置変化情報は、約1秒ごとに取得されます。タイミングまたはカウントのメカニズムを追加して、データを取得する頻度を減らすことができます。

タイミングメカニズムを追加しても、インターフェースリターンの頻度を減らすことはできませんが、異常な位置決めポイントの確率を効果的に減らすことができます。

10 回ごとに位置情報を抽出します。例:

count = 0 とします。
onLocationChange(res => {
	カウント > 10 && (カウント = 0)
	count == 0 && positionArr.push([経度,緯度])
	カウント++;
})

有効なデータの検出

抽出された各情報をpositionArrの最後の座標データと比較する

// 2 つの座標点間の距離を取得するメソッドをカプセル化します。
距離を取得します(緯度1、経度1、緯度2、経度2) {
	戻り距離
},

データが要件を満たしている場合は、positionArrにプッシュします。

アクティビティトラックのレンダリング

getPolyline() {
	定数ポリライン = [];
	positionArr.forEach(item => {
		..........
	})
	ポリラインを返す
}

最新の座標点が追加されるたびにアクティビティトラックを再レンダリングする必要がある

トラック追跡を終了

追跡が終了したら:

1. 終了座標点を終点マークとしてマーカーに更新します。

2. アクティビティトラックを更新する

これで終わり

wx.offLocationChange()
positionArr.push([経度,緯度])
ポリラインを取得する()

注: offLocationChange にはコールバック メソッドがなく、同期的に実行されます。 （ドキュメントを信用しないでください）

位置決めが不要になったときに監視と記録が行われないように、位置決めの監視をオフにするメカニズムを追加することを忘れないでください。これにより、パフォーマンスに影響が出ます。

Amap API の紹介

各測位ポイントの位置情報を記録する必要がある場合、ミニプログラムはAmapのAPIの導入をサポートしています。お時間がありましたら、ぜひご覧ください。

はじめる

要約する

これで、ユーザーの移動軌跡を記録するWeChatミニプログラムに関するこの記事は終了です。より関連性の高いミニプログラムユーザー移動軌跡コンテンツについては、123WORDPRESS.COMの以前の記事を検索するか、次の関連記事を引き続き閲覧してください。今後とも123WORDPRESS.COMを応援してください。