システムエクスプレス株式会社

chrome や safari などのブラウザで位置情報（GPS）を取得して緯度や経度やグーグルマップを表示するスクリプトです。
※スマホなどGPSの機能がついている端末でないと位置情報は取得できません。

サンプルデモ

ソース

<script type="text/javascript" src="//maps.google.com/maps/api/js?key=AIzaSyAIi2iVN_BFP7tn7XzvwPpEFz7oC9iJqEk"></script> <script type="text/javascript"> function setLocation(pos){ // 緯度・経度を取得 lat = pos.coords.latitude; lon = pos.coords.longitude; // 緯度・経度を表示 document.getElementById("table_lat").innerHTML = lat; document.getElementById("table_lon").innerHTML = lon; // google map へ表示するための設定 latlon = new google.maps.LatLng(lat,lon); map = document.getElementById("map"); opt = { zoom: 17, center: latlon, mapTypeId: google.maps.MapTypeId.ROADMAP, scrollwheel: false, scaleControl: true, disableDoubleClickZoom: true, draggable: false }; // google map 表示 mapObj = new google.maps.Map(map, opt); // マーカーを設定 marker = new google.maps.Marker({ position: latlon, map: mapObj }); } // エラー時に呼び出される関数 function showErr(err){ switch(err.code){ case 1 : alert("位置情報の利用が許可されていません"); break; case 2 : alert("デバイスの位置が判定できません"); break; case 3 : alert("タイムアウトしました"); break; default : alert(err.message); } } // geolocation に対応しているか否かを確認 if("geolocation" in navigator){ var opt = { "enableHighAccuracy": true, "timeout": 10000, "maximumAge": 0, }; navigator.geolocation.getCurrentPosition(setLocation, showErr, opt); }else{ alert("ブラウザが位置情報取得に対応していません"); } </script> <div id="map" style="height:500px"></div> <table> <tr><th>緯度</th><td id="table_lat"></td></tr> <tr><th>経度</th><td id="table_lon"></td></tr> </table>