GPS位置情報取得
:LiTarget: 用途
ブラウザ Geolocation API で現在地取得。出退勤打刻・現場記録に。
:LiSparkle: 特徴
- 現在地取得
- 精度判定
- 権限プロンプト
- リアルタイム追跡
:LiCode: コード(コピペ用)
export function getCurrentPosition(): Promise<{ lat: number; lng: number; accuracy: number }> {
return new Promise((resolve, reject) => {
if (!navigator.geolocation) return reject(new Error('GPS非対応'));
navigator.geolocation.getCurrentPosition(
pos => resolve({
lat: pos.coords.latitude,
lng: pos.coords.longitude,
accuracy: pos.coords.accuracy,
}),
err => reject(err),
{ enableHighAccuracy: true, timeout: 10000, maximumAge: 0 }
);
});
}
// リアルタイム追跡
export function watchPosition(onUpdate: (pos: GeolocationPosition) => void) {
return navigator.geolocation.watchPosition(onUpdate, console.error, {
enableHighAccuracy: true,
});
}
:LiHandPointer: 使い方
対象プロジェクトに該当ファイルをコピーして、props を流し込むだけ。
:LiAlertCircle: 注意事項
- 依存パッケージを忘れず追加