メシのタネ

めしのたねになるIT情報配信サイト


Geolocationについてしらべてみた

, ,

  1. API
  2. Geolocationについてしらべてみた

newwebweb

Geolocationとはユーザーの位置情報を教えてくれるAPIです。Geolocationを使って経度と緯度が取得できます。自分はGeolocation以外で位置情報を取得したことがないんですけど、以前は各キャリアごとに独自の仕組みが合ったみたいで、アプリ開発する際にもそれに沿って開発する必要があったらしいです。Geolocationを使えば、統一された方法で、経度、緯度の取得が可能ですが、ブラウザが対応してないとGeolocationを使う事ができないです。

仕組み

Geolocationは無線LAN・携帯電話基地局・GPS・IPアドレス等から送信されたデータを取得します。
端末やインターネットの接続方法によって、機能の仕組みが異なります。

デスクトップPCの経度、緯度取得方法

IPアドレスから、現在地を判断します。

無線LANからの経度、緯度取得方法

Wifiアクセスポイントから現在地を判断します。

携帯電話からの経度、緯度取得方法

携帯が、一番近い電波塔のIDを含んでる場合、またはGPS機能が有効である場合、このどちらかか全部を使って、現在地を判断します。
今はこうやって取得されるデータの事を位置情報データって呼んだりしてるみたいです。

対応ブラウザ

Geolocationは以下のブラウザに対応しています。

ブラウザ 対応バージョン
Internet Explorer 9以降
Firefox 3.5以降
Google Chrome 5以降
Safari 5以降
Opera 10以降

取得できる情報

リクエストが成功すると、Geopositionオブジェクトが返ってきます。
その中に時間とか、位置情報が入ってます。

cordsプロパティ
latitude 緯度
longitude 経度
altitude 高度
accuracy 緯度/経度の誤差
altitudeAccuracy 高度の誤差
heading 方向

cordsの中にはこれだけの情報が入っています。

経度、緯度の取得方法

GeolocationAPIを使うにはJavaScriptを使います。こうやって書くと、経度と緯度が取得できます。



<script>

//Geolocationが使用できるかどうかチェック
navigator.geolocation.getCurrentPosition(okCallback, erCallback);

//成功時に実行される
function okCallback(pos) {

//posに経度と緯度が入ってくる

  lat = pos.coords.latitude;
  lng = pos.coords.longitude;

//経度と緯度を変数に入れる


  document.write("緯度  "+lat+"<Br />")
  document.write("経度  "+lng)
}

//エラー時に実行される
function erCallback(er) {
  errorCode = er.code;
}

</script>

タイムアウトなどのオプションも指定できるので、マニュアルをチェックしてみて下さい。

参考

Geolocation 機能の仕組み
Geolocation.getCurrentPosition() MDN


コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

This site uses Akismet to reduce spam. Learn how your comment data is processed.

若い頃、「仕事中にハマったこと」や「誰かに共有したい技術的な気づき」をアウトプットしたくてブログを始めましたが、勢い任せでよく分からない記事を大量生産し、あえなく飽きて終了。

改めて今、キャリア15年分の経験や知識が、これからITエンジニアを目指す方や、同じような課題で悩んでいる現役エンジニアの「メシのタネ」になるような記事を残したいと思っています。
※過去の記事は見ると精神が崩壊するため、そっとしておいてください。

🛠 経歴という名の珍道中:
文系Fラン → 広告営業 → Web営業 → 通信営業 → Web進行 → 出版 → Web媒体運用 → ソフトウェアハウス → SES → フリーランス

専門教育も受けず、転職歴も多数。履歴書はまるで時系列の事故記録のようですが、試行錯誤を重ね、なんとかエンジニアとして食べています。

このブログでは、そんな「履歴書クラッシャー型エンジニア」が送る、
名古屋一敷居の低い、実務に役立つ技術ブログを目指します。

PHP
魔王と行く! / Interface / Polymorphism / Ontology 深淵ガイドNew!!
Laravel
Laravel 12、「コード 1 行も書き換えず未来へ」──静かな革命の手順書New!!
Laravel
LaravelのMiddlewareって意味あるの?仕組み・使いどころ・やらかしまで整理してみたNew!!
Laravel
ServiceProviderって何してるの?DIの背後で動いてるやつの正体New!!
Laravel
LaravelのサービスコンテナとDI、「書いてるだけで動く」コードの正体
Laravel
Laravelのアーキテクチャ、実は誰もわかってない説