Follow Fang!: HTML5 Geolocation

2013/07/27

HTML5 Geolocation

最近要實作一些Google Maps的產品，需要用到Geolocation
有需要可以參考HTML5 Geolocation

程式碼：

<!DOCTYPE html>
<html>

<body>

<p id="demo">Click the button to get your coordinates:</p>

<button onclick="getLocation()">Try It</button>
<script>
  var x = document.getElementById("demo");
  
  function getLocation()
  {
    if (window.navigator.geolocation){
        navigator.geolocation.getCurrentPosition(showPosition);
    }else{
      x.innerHTML = "Geolocation is not supported by this browser.";
    }
  }
  
  function showPosition(position)
  {
    x.innerHTML="Latitude: " + position.coords.latitude + 
    "<br>Longitude: " + position.coords.longitude; 
  }
</script>

</body>

</html>

執行結果：

參考資料：
http://www.w3.org/TR/geolocation-API/
http://www.w3schools.com/html/html5_geolocation.asp