HTMLジオロケーションAPIは、ユーザーの位置を特定するために使用されます。
W3CジオロケーションAPIとは何ですか？
W3CジオロケーションAPIは、クライアント側デバイスの地理的位置情報を取得するためのインタフェースを標準化するために、World Wide Webコンソーシアム（W3C）の努力です。
これは、クライアントアプリケーションで実行すると、アプリケーション・プログラミング・インターフェース（API）のために透明であり、位置情報サーバのコンサルティングを通じてクライアントのデバイスの場所を与えることを、オブジェクトのセットを定義して、ECMAScriptの標準に準拠しています。
位置情報の最も一般的な供給源は、IPアドレス、Wi-FiとブルートゥースMACアドレス、無線周波数識別（RFID）、Wi-Fi接続の位置、又はデバイス、全地球測位システム（GPS）とGSM / CDMAセルIDです。
位置は、利用可能な最良の位置情報ソースによって与えられた精度で返されます。
Webブラウザでの展開
Webブラウザがそれを実装している場合Webページが直接ジオロケーションAPIを使用することができます。 歴史的に、一部のブラウザでは、Google Gearsのプラグインを介して支持を得ることができ、これは、2010年に廃止され、それが依存サーバー側のAPIは、2012年に応答を停止しました。
ジオロケーションAPIは、パーソナルデジタルアシスタント（PDA）やスマートフォンなどのモバイルデバイス向けのWebアプリケーションに理想的に適しています。 デスクトップコンピュータでは、W3CジオロケーションAPIは、バージョン3.5以降のFirefoxで動作し、Google Chromeの、オペラ10.6は、Internet Explorer 9.0、およびモバイルデバイス上のSafari 5は、それは、Android（ファームウェア2.0以降）を選択し、iOSの、Windowsの携帯電話とMaemoの上で動作します。
2010年11月24日以来、AndroidとSymbianのデバイス（S60世代3＆5）のために利用可能 - W3CジオロケーションAPIもオペラモバイル10.1でサポートされています。
GoogleのGearsがネイティブにGearsを実装歯車プラグインなど、Internet Explorer 7.0以降、およびGoogle Chromeのを含め、古いと非対応のブラウザのためのジオロケーションのサポートを提供します。 また、Windows Mobile用のAndroidブラウザ（前のバージョン2.0）とOpera Mobile用のプラグインなどのモバイルデバイス上のジオロケーションをサポート。
しかし、GoogleのGearsのジオロケーションAPIは、W3CジオロケーションAPIと互換性がサポートされなくなりました。
特徴
W3CジオロケーションAPIの結果は、通常、すべての位置ソースに依存する緯度及び経度（座標）、高度（高さ）、および[位置の精度集め]を含む4つの位置特性を与えるであろう。
一部のクエリでは、高度は値を生じないか、または返すことができます。
ユーザの位置を探します
HTMLジオロケーションAPIは、ユーザーの地理的位置を取得するために使用されます。
これは、プライバシーを侵害することができますので、ユーザはそれを承認しない限り、位置は利用できません。
ブラウザのサポート
表中の数字は完全にジオロケーションをサポートする最初のブラウザのバージョンを指定します。
| API | |||||
|---|---|---|---|---|---|
| Geolocation | 5.0 | 9.0 | 3.5 | 5.0 | 16.0 |
Note:ジオロケーションは次のように、GPS付きデバイスのためにはるかに正確であるiPhone 。
HTMLのジオロケーションを使用します
getCurrentPosition()メソッドは、ユーザーの位置を取得するために使用されます。
以下の例では、ユーザの位置の緯度と経度を返します。
例
<script>
var x = document.getElementById("demo");
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
x.innerHTML = "Geolocation is not supported by this browser.";
}
}
function showPosition(position) {
x.innerHTML = "Latitude: " + position.coords.latitude +
"<br>Longitude: " + position.coords.longitude;
}
</script> »それを自分で試してみてください 例を説明します：
- ジオロケーションがサポートされているか確認してください
- サポートされている場合、実行getCurrentPosition()メソッドを。 そうでない場合、ユーザーにメッセージを表示します
- 場合getCurrentPosition()メソッドは成功し、それは座標がパラメータで指定された関数にオブジェクトを返す(showPosition)
- showPosition()関数は、緯度と経度を出力します。
上記の例ではありませんエラー処理で、非常に基本的なジオロケーションスクリプトです。
エラーおよび拒否の処理
2番目のパラメータgetCurrentPosition()メソッドは、エラーを処理するために使用されます。 それは、ユーザの位置の取得に失敗した場合に実行する関数を指定します。
例
function showError(error) {
switch(error.code) {
case error.PERMISSION_DENIED:
x.innerHTML = "User denied the request for Geolocation."
break;
case error.POSITION_UNAVAILABLE:
x.innerHTML = "Location information is unavailable."
break;
case error.TIMEOUT:
x.innerHTML = "The request to get user location timed out."
break;
case error.UNKNOWN_ERROR:
x.innerHTML = "An unknown error occurred."
break;
}
} »それを自分で試してみてください 地図での検索結果を表示
マップで結果を表示するには、Googleマップなどの地図サービスへのアクセスを、必要とします。
以下の例では、返された緯度と経度は、Googleマップ内の位置を示すために使用される(using a static image) 。
例
function showPosition(position) {
var latlon = position.coords.latitude + "," + position.coords.longitude;
var img_url = "http://maps.googleapis.com/maps/api/staticmap?center=
"+latlon+"&zoom=14&size=400x300&sensor=false";
document.getElementById("mapholder").innerHTML = "<img src='"+img_url+"'>";
} »それを自分で試してみてください Googleマップスクリプト
マーカー、ズームやドラッグオプションを使用してインタラクティブなGoogleマップを表示する方法。
場所固有の情報
このページには、マップ上のユーザの位置を表示する方法を示しました。
ジオロケーションは次のように、また、ロケーション固有の情報のために非常に有用です：
- 最新の現地情報
- ユーザーに近いポイントの関心を示します
- ターンバイターンナビゲーション(GPS)
getCurrentPosition()メソッド-データを返します
getCurrentPosition()が成功した場合、メソッドは、オブジェクトを返します。 緯度、経度及び精度特性が常に返されます。 他のプロパティは、利用可能な場合に返されます。
| プロパティ | 収益 |
|---|---|
| coords.latitude | 10進数で緯度 |
| coords.longitude | 10進数で経度 |
| coords.accuracy | 位置の精度 |
| coords.altitude | 平均海抜メートルで高度 |
| coords.altitudeAccuracy | 位置の高度の精度 |
| coords.heading | 北から時計回り度などの見出し |
| coords.speed | 毎秒メートルで速度 |
| timestamp | 応答の日付/時間 |
ジオロケーションオブジェクト - その他の興味深い方法
watchPosition() -ユーザの現在位置を返しますし、ユーザーの移動に伴って更新された位置を返すために続けて(like the GPS in a car) 。
clearWatch() -停止watchPosition()メソッドを。
以下の実施例はwatchPosition()メソッドを。 あなたは、このテストするために、正確なGPSデバイスを必要とする(like iPhone ) ：
例
<script>
var x = document.getElementById("demo");
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.watchPosition(showPosition);
} else {
x.innerHTML = "Geolocation is not supported by this browser.";
}
}
function showPosition(position) {
x.innerHTML = "Latitude: " + position.coords.latitude +
"<br>Longitude: " + position.coords.longitude;
}
</script> »それを自分で試してみてください