HTML5-ジオロケーション

HTML5 Geolocation APIを使用すると、現在地をお気に入りのWebサイトと共有できます。JavaScriptは緯度と経度をキャプチャし、バックエンドWebサーバーに送信して、地元のお店を見つけたり、地図上に現在地を表示したりするなど、場所を意識した凝ったことを行うことができます。

現在、ほとんどのブラウザとモバイルデバイスはGeolocationAPIをサポートしています。ジオロケーションAPIは、グローバルナビゲーターオブジェクトの新しいプロパティで動作します。次のように作成できるジオロケーションオブジェクト-

var geolocation = navigator.geolocation;

ジオロケーションオブジェクトは、ウィジェットがデバイスの地理的位置に関する情報を取得できるようにするサービスオブジェクトです。

ジオロケーション手法

ジオロケーションオブジェクトは、次のメソッドを提供します-

シニア番号	方法と説明
1	getCurrentPosition（） このメソッドは、ユーザーの現在の地理的位置を取得します。
2	watchPosition（） このメソッドは、デバイスの現在の地理的位置に関する定期的な更新を取得します。
3	clearWatch（） このメソッドは、進行中のwatchPosition呼び出しをキャンセルします。

例

以下は、上記の方法のいずれかを使用するためのサンプルコードです-

function getLocation() {
   var geolocation = navigator.geolocation;
   geolocation.getCurrentPosition(showLocation, errorHandler);
}

ここで、showLocationとerrorHandlerは、次のセクションで説明するように実際の位置を取得し、エラーがある場合はそれを処理するために使用されるコールバックメソッドです。

ロケーションプロパティ

ジオロケーションメソッドgetCurrentPosition（）およびgetPositionUsingMethodName（）は、ロケーション情報を取得するコールバックメソッドを指定します。これらのメソッドは、オブジェクトと非同期に呼び出されますPosition 完全な位置情報を保存します。

ザ・ Positionオブジェクトは、デバイスの現在の地理的位置を指定します。場所は、方位と速度に関する情報とともに、地理座標のセットとして表されます。

次の表に、Positionオブジェクトのプロパティを示します。システムが値を提供できない場合のオプションのプロパティの場合、プロパティの値はnullに設定されます。

プロパティ	タイプ	説明
座標	オブジェクト	デバイスの地理的な場所を指定します。場所は、方位と速度に関する情報とともに、地理座標のセットとして表されます。
coords.latitude	数	緯度の推定値を10進角で指定します。値の範囲は[-90.00、+ 90.00]です。
coords.longitude	数	経度の推定値を10進角で指定します。値の範囲は[-180.00、+ 180.00]です。
coords.altitude	数	[オプション] WGS84楕円体の上のメートル単位で高度推定値を指定します。
coords.accuracy	数	[オプション]緯度と経度の推定値の精度をメートル単位で指定します。
coords.altitudeAccuracy	数	[オプション]高度推定の精度をメートル単位で指定します。
coords.heading	数	[オプション]デバイスの現在の移動方向を、真北を基準にして時計回りにカウントする度数で指定します。
coords.speed	数	[オプション]デバイスの現在の対地速度をメートル/秒で指定します。
タイムスタンプ	日付	位置情報が取得され、Positionオブジェクトが作成された時刻を指定します。

例

以下は、Positionオブジェクトを利用するサンプルコードです。ここで、showLocationメソッドはコールバックメソッドです-

function showLocation( position ) {
   var latitude = position.coords.latitude;
   var longitude = position.coords.longitude;
   ...
}

エラーの処理

ジオロケーションは複雑であり、エラーをキャッチして適切に処理することが非常に必要です。

geolocationsメソッドgetCurrentPosition（）およびwatchPosition（）は、エラーハンドラーコールバックメソッドを利用します。 PositionErrorオブジェクト。このオブジェクトには次の2つのプロパティがあります-

プロパティ	タイプ	説明
コード	数	エラーの数値コードが含まれています。
メッセージ	ストリング	人間が読める形式のエラーの説明が含まれています。

次の表に、PositionErrorオブジェクトで返される可能性のあるエラーコードを示します。

コード	絶え間ない	説明
0	未知のエラー	不明なエラーが原因で、メソッドはデバイスの場所を取得できませんでした。
1	アクセス拒否	アプリケーションに位置情報サービスを使用する権限がないため、このメソッドはデバイスの場所を取得できませんでした。
2	POSITION_UNAVAILABLE	デバイスの場所を特定できませんでした。
3	タイムアウト	メソッドは、指定された最大タイムアウト間隔内に位置情報を取得できませんでした。

例

以下は、PositionErrorオブジェクトを利用するサンプルコードです。ここで、errorHandlerメソッドはコールバックメソッドです-

function errorHandler( err ) {
   
   if (err.code == 1) {
      
      // access is denied
   }
   ...
}

ポジションオプション

以下は、getCurrentPosition（）メソッドの実際の構文です。

getCurrentPosition(callback, ErrorCallback, options)

ここで3番目の引数は PositionOptions デバイスの地理的位置を取得するためのオプションのセットを指定するオブジェクト。

以下は、3番目の引数として指定できるオプションです-

プロパティ	タイプ	説明
enableHighAccuracy	ブール値	ウィジェットが可能な限り最も正確な位置推定を受信するかどうかを指定します。デフォルトでは、これはfalseです。
タイムアウト	数	タイムアウトプロパティは、Webアプリケーションが位置を待機するミリ秒数です。
maximumAge	数	キャッシュされた位置情報の有効期限をミリ秒単位で指定します。

例

以下は、上記の方法の使用方法を示すサンプルコードです-

function getLocation() {
   var geolocation = navigator.geolocation;
   geolocation.getCurrentPosition(showLocation, errorHandler, {maximumAge: 75000});
}