JavaScript で位置情報を取得してみる
JavaScript で位置情報を取得してみる
JavaScript の位置情報取得API geolocation を使ってみたのでメモ。
サンプル
PC からも試せますが、モバイル端末ではリアルタイムで位置の違いを見ることができます。
http://cartman0.github.io/geolocationTest/
コード
geolocation について
geolocation に対応しているかチェック
if (!navigator.geolocation){
// geolocationに対応していないときの処理
}else{
//正常の処理
}
位置情報を取得するのにgeolocation では2種類の関数がある。
getCurrentPosition
1回だけ位置情報を取得。
navigator.geolocation.getCurrentPosition(success(position), error(e), option);
watchPosition
継続して取得できる。しかし、モバイル端末ではバッテリーの減りが早いので注意が必要。
navigator.geolocation.watchPosition(success(position), error(e), option);
成功時に取得できる値
それぞれの第1引数のコールバック関数(成功時に行われる関数)のオブジェクトに格納される。
function success(position) {
var time = position.timestamp; //タイムスタンプ
var lat = position.coords.latitude; //緯度
var lon = position.coords.longitude; //経度
var alt = position.coords.altitude; //高度
var acc = position.coords.accuracy; //正確性
var alt_acc = position.coords.altitudeAccuracy;//高度の正確性
var heading = position.coords.heading; //方位
var speed = position.coords.speed; //速度
}
プロパティ | 値 | 単位・最大最小値 |
---|---|---|
timestamp | タイムスタンプ | |
coords.latitude | 緯度 | [degree] (-90 ~ 90) |
coords.longitude | 経度 | [degree] (-180 ~ 180) |
coords.altitude | 高度 | [m] |
coords.accuracy | 正確性(緯度・経度の誤差) | [m] |
coords.altitudeAccuracy | 高度の正確性(誤差) | [m] |
coords.heading | 方位 | [degree] (0~360) |
coords.speed | 速度 | [m/s] |
失敗時
同様に、失敗時にはerror オブジェクトが返される(第2引数のコールバック関数)。
// 位置情報の取得に失敗した場合の処理
function err(error){
var e = "";
if (error.code == 1) { //1=位置情報取得が許可されてない(ブラウザの設定)
e = "位置情報が許可されてません";
}
if (error.code == 2) { //2=現在地を特定できない
e = "現在位置を特定できません";
}
if (error.code == 3) { //3=位置情報を取得する前にタイムアウトになった場合
e = "位置情報を取得する前にタイムアウトになりました";
}
}
プロパティ | 値 | 説明 |
---|---|---|
error.code | 1 | 位置情報の取得が許可されていない |
error.code | 2 | 位置情報の取得が利用できない |
error.code | 3 | タイムアウト |
eroor.message | エラーメッセージ |
オプション
第3引数にオプションを設定できる。
var option = {
enableHighAccuracy: true, // より高精度な位置を求める
maximumAge: 1, // 最後の現在地情報取得が [maximuAge][ms]以内であればその情報を再利用する設定
timeout: 10000 // timeout[ms]以内に現在地情報を取得できなければ、処理を終了
};
プロパティ | 説明 |
---|---|
option.enableHighAccuracy | より高い正確性を求める(取得時間が遅くなる)。モバイル端末ではGPSを使用する(バッテリー消費が激しい)。 |
option.maximumAge | 位置情報の有効期限(キャッシュ)。最後の現在地情報取得が [maximuAge][ms]以内であればその情報を再利用する |
option.timeout | タイムアウトまでの時間。timeout[ms]以内に現在地情報を取得できなければ、処理を終了する。 |