【JavaScript】 iPhone で、ウェブからGPS位置情報を扱ってみる

ASCII.jp の記事『iPhoneのGPSをJavaScriptで操ろう』を参考に、iPhoneのSafariでGPS(位置情報サービス)情報を取得してみた。

位置情報を扱う navigator.geolocation

GPSの位置情報を扱うAPIは、navigator.geolocation というオブジェクトにまとめられている。

Geolocation API は、W3Cによる標準仕様なようだ。W3Cの仕様書 Geolocation API Specification(英語) をよく読むと、詳しいことがわかりそう。("Candidate"だから、勧告候補段階なのかな？)

取得の仕方は2通り

単発で一回だけ取得する方法と、定期的に更新し続ける方法があるようだ。

単発で一回だけ取得する getCurrentPosition()

<script type="text/javascript">
navigator.geolocation.getCurrentPosition(
  function(position){
    /* ここに取得後の処理を実装 */
  }
);
</script>

• 実装サンプル1

getCurrentPosition() の引数にコールバック関数を渡すと、そこに位置情報を格納したオブジェクト position が渡されるという仕組みのようだ。この position に格納された値を元に、位置を特定することができる。

仕様書を見ると、第2引数にエラー発生時のコールバック関数を指定できたり、第3引数にオプション的なオブジェクトを渡しているサンプルも見えるが、今回は詳しくは試さない。

定期的に更新する watchPosition() と、停止する clearWatch()

<script type="text/javascript">
navigator.geolocation.watchPosition(
  function(position){
    /* ここに取得後の処理を実装 */
  }
);
</script>

• 実装サンプル2

さきほどの getCurrentPosition() と同様、引数にコールバック関数を指定し、その引数に position が渡される構造は変わらない。しかしこちらの watchPosition() は、定期的にコールバック関数を実行し続ける点が異なるようだ。

この処理を停止するには、clearWatch() を実行する。

<script type="text/javascript">
navigator.geolocation.clearWatch();
</script>

位置情報を取り出す

コールバック関数に渡される position から、次のような値が取得できる。

position.timestamp

取得した日時(ブラウザによって型が異なる？)

position.coords.latitude

緯度

position.coords.longitude

経度

position.coords.altitude

高度

position.coords.accuracy

水平方向の誤差

position.coords.altitudeAccuracy

垂直(高さ)方向の誤差

position.coords.heading

方向

position.coords.speed

速度

件のASCII.jp の記事によれば、iPhone 3Gではこれらすべての値を取得できるわけではありません。たとえば「高度」や「垂直（高さ）方向の誤差」には対応していません。とのこと。iPhone以外の端末やブラウザも含め、実装状況によって未対応の場合を考慮しておいた方が良さそうだ。

iPhone以外はどうなんだろう？

前述の通り、Geolocation API は W3C による標準仕様のようだ。iPhoneでは、この仕様に従って実装されている。おそらく、Android 系のスマートフォンでも同様の実装が期待できそうだ(Android上での動作は未確認だけど)。

それからなんと、普通のPCブラウザでも利用できた。まぁ、標準仕様なので当然ちゃ当然なのだけど、モバイルPCなどでGPS対応している場合などは、GPSを利用したPCサイトのサービスなどもあり得そうだ。

ただやはり、このAPIにそもそも対応していない場合や、GPSが利用できない場合などを考慮した実装が用意されるべきだろう。(プログレッシブ・エンハンスメント)