hifiveの位置情報用オブジェクト h5.api.geo の紹介

HTML5で追加されたAPIの一つにGeoLocationがあります。いわゆる位置情報を扱うAPIですが、標準で提供されるものはそれほど機能が多い訳ではありません。

function success(position) {
  // 位置情報取得成功時の処理
}

function error(msg) {
  // 位置情報取得失敗時の処理
}

if (navigator.geolocation) {
  navigator.geolocation.getCurrentPosition(success, error);
} else {
  error('not supported');
}

このような使い方が多いかと思います。

hifiveでは navigator.geolocation をベースに機能追加を行った h5.api.geo を提供しています。

位置情報をサポートしているかどうか

通常、navigator.geolocationの有無で判定しますがIE9においてはnavigator.geolocationへのアクセスがメモリリークしますのでisSupportedを使うのが安全です。

if (h5.api.geo.geoisSupported()) {
  // サポート
} else {
  // 非サポート
}

現在位置の取得

現在位置を取得する際には h5.api.geo.getCurrentPosition を使います。Promiseに対応しています。

h5.api.geo.getCurrentPosition()
.then(function(position) {
  // 成功時の処理
})
.fail(function() {
  // エラー時の処理
});

オプションとして以下が渡せます。

enableHighAccuracy

正確な位置を取得するか (ただし消費電力の増加や応答が遅延する)

timeout

位置情報を取得するまで待機する時間 (ミリ秒)

maximumAge

キャッシュされた位置情報の有効期間を指定する (ミリ秒)

位置情報のウォッチ

移動している際などに便利なのが watchPosition です。hifiveでも同じく watchPosition をサポートしています。hifive版ははPromiseが使えます。

h5.api.geo.watchPosition()
.progress(function(position) {
  // 定期的に呼ばれます
})

doneではないので注意してください。オプションは getCurrentPosition と同じです。

こちらは上が getCurrentPosition の実行結果、下の地図は watchPosition の実行結果です。

2点間の距離を測る

2つの位置情報館の距離を測定します。

distance = h5.api.geo.getDistance(lat1, lng1, lat2, lng2, geoSystem);

1つ目の緯度経度、2つめの緯度経度を渡します。最後の geoSystem は h5.api.geo.GS_GRS80（世界測地系）と h5.api.geo.GS_BESSEL （日本測地系）のどちらかが指定できます（引数を与えない場合は世界測地系になります）。

h5.api.geo を使うと位置情報の取り扱いがとても簡単になります。ぜひご活用ください！

hifive – HTML5企業Webシステムのための開発プラットフォーム – hifive