位置情報を使ったWebサービスが増えていますが、Geolocation APIを使うと手軽に位置情報を取得することができます。というわけで今回はGeolocation APIの使い方を勉強がてら記事にしたいと思います!
Geolocation APIとは
公式ドキュメント
いきなり英文のドキュメントはハードルが高いので、日本語の記事で分かりやすかったものを参考にしてみました。

これらの記事によると
geolocation API により、ユーザーは希望すれば自身の場所を web アプリケーションに通知することができるようになります。なお、プライバシー保護の観点から、ユーザーは位置情報が送信される際には確認を求められます。
とあります。位置情報をwebアプリケーションに通知することができ、プライバシーに配慮するためユーザーの許可がなければ使えないという仕組みです。ちなみに今まで各キャリアごとに位置情報を取得するための仕組みを開発する必要があったそうで、便利な世の中になりましたね。
簡単なデモを通じて、説明していきたいと思います。
デモ
Geolocation APIとGeolocationオブジェクト
geolocation API は navigator.geolocation
オブジェクトを通じて提供されます。今回のデモでは、
navigator.geolocation.getCurrentPosition(successCallback, errorCallback);
というようにして現在地を取得するための準備をしています。ちなみにメソッドは3つ用意されており、
getCurrentPosition()
・・・現在地を取得するために使います。watchPosition()
・・・デバイスの位置が変化するたびに位置情報を更新するために使います。clearWatch()
・・・位置情報を継続して監視することを解除するために使われます。
があります。
それぞれの数値取得
各位置情報の取得は以下のようにして取得できます。
- 緯度・・・position.coords.latitude
- 経度・・・position.coords.longitude
- 高度・・・position.coords.altitude
- 緯度・経度の誤差・・・position.coords.accuracy
- 高度の誤差・・・position.coords.altitudeAccuracy
- 方角・・・position.coords.heading
- 速度・・・position.coords.speed
エラーコード
エラーコードはcode属性を用いることで取得ができます。エラーコードは以下の3つが返ります。
- エラーコード1・・・位置情報の利用が許可されていない(ユーザーが位置情報の利用を許可しなかった場合など)
- エラーコード2・・・デバイスの位置が判定できない(プロバイダが内部エラーとなっている場合など)
- エラーコード3・・・タイムアウト(timeout属性で指定された時間内にPositionオブジェクトを取得できなかった場合など
ちなみにエラーメッセージもmessage属性で取得できますが、ユーザーインタフェースではなくあくまでデバッグ用という位置づけのため、メッセージは自分で作成するのが一般的です。
最後に
すごくあっさりした内容でまとめましたが、必要に応じてもっと深く学んでいこうと思います。位置情報を使ったアプリケーションを作ってみたいので、色々やってみます!