2013年12月25日水曜日

スマホのWebブラウザから位置情報を取得する

最近のiOS、Android端末は Geolocation API に対応しているので、Webブラウザ経由で位置情報が取得できる。
ただし、ブラウザ側で許可されてないとダメだけど・・・
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <script>
      function getPosition() {
        navigator.geolocation.getCurrentPosition(
          function(position) { // 取得成功
            document.getElementById("lat").value = position.coords.latitude;
            document.getElementById("lng").value = position.coords.longitude;
          },  
          function(error) { // 取得失敗
            switch(error.code) {
              case 1:
                alert("位置情報の利用が許可されていません。");
                break;
              case 2:
                alert("デバイスの位置が判定できません。");
                break;
              case 3:
                alert("タイムアウトしました。");
                break;
            }
          },
          {
            enableHighAccuracy: true
          }
        );
      }
    </script>
  </head>
  <body>
    <input type="text" name="lat" id="lat" value="" />
    <input type="text" name="lng" id="lng" value="" />
    <input type="button" value="取得" onClick="javascript:getPosition();" />
  </body>
</html>

0 件のコメント:

コメントを投稿