トップへ(mam-mam.net/)

WEBサイトでGPSから緯度経度を取得して表示

検索:

WEBサイトでGPSから緯度経度を取得して表示

navigator.geolocation.getCurrentPosition()
メソッドを使うとGPS機能から緯度経度を取得することができます。
(許可を求めるダイアログが表示されます)

【参考】
iPhone(Safari)で"User Denied Geolocation"が表示される場合は、
「設定」⇒「一般」⇒「転送またはiPhoneをリセット」⇒「リセット」⇒「位置情報とプライバシーをリセット」を試してください。

緯度経度表示
ここに緯度経度が表示されます

ソースコード

<input type="button" onClick="get_location_gps()">
<div id="latlon">ここに緯度経度が表示されます</div>

<script>
  //ボタンを押したら呼び出される関数
  function get_location_gps(){
    if(navigator.geolocation){
      //現在の位置情報取得。正常に取得するとsuccessCallback_gpsがコールバックされる
      navigator.geolocation.getCurrentPosition(
        //成功時に呼ばれる関数
        successCallback_gps,
        //敗時に呼ばれる関数
        errorCallback_gps,
        {
          //何ミリ秒以前にキャッシュされた位置を返してもよいか
          //0を指定すると現在の位置情報を取得する
          maximumAge:0,
          //位置情報取得に要してよい最大時間(ミリ秒)
          timeout:3000,
          //true:正確な情報が欲しい場合  false:正確でなくてよい場合
          enableHighAccuracy:true,
        }
      );
    }else{
      //navigator.geolocation()メソッドが使えない
      alert('この端末は使えません');
    }
  }
  //緯度経度の取得が成功した時に呼び出される関数
  function successCallback_gps(pos){
    var posLatitude=pos.coords.latitude;
    var posLongitude=pos.coords.longitude;
    document.getElementById("latlon").innerHTML=
      '緯度:'+posLatitude+', 経度:'+posLongitude+'<br>'+
      '<a href="https://www.google.co.jp/maps/@'+
      posLatitude+','+posLongitude+',18z?hl=ja&entry=ttu" target="_blank">googleMapで表示</a>';
  }
  //失敗した時に呼び出される関数
  function errorCallback_gps(error){
    //エラー内容を表示する
    alert(error.message);
  }
</script>