Cách sử dụng tọa độ Geolocation trong HTML5

HTML5 Geolocation API cho phép trang web truy cập vị trí thiết bị (vĩ độ, kinh độ) sau khi người dùng cho phép. Dùng JavaScript gọi navigator.geolocation.

Đối tượng Position chứa:

Thuộc tính	Kiểu	Mô tả
`coords`	Object	Chứa tọa độ địa lý, heading, speed
`coords.latitude`	Number	Vĩ độ (-90 đến +90)
`coords.longitude`	Number	Kinh độ (-180 đến +180)
`coords.accuracy`	Number	Độ chính xác (mét)
`coords.altitude`	Number\|null	Độ cao so với mặt nước (mét)
`coords.altitudeAccuracy`	Number\|null	Độ chính xác độ cao
`coords.heading`	Number\|null	Hướng di chuyển (độ, 0=Bắc)
`coords.speed`	Number\|null	Tốc độ (m/s)

Các phương thức chính:

getCurrentPosition(success, error, options) – Lấy vị trí một lần
watchPosition(success, error, options) – Theo dõi vị trí liên tục (trả về watchID)
clearWatch(watchID) – Hủy theo dõi

Ví dụ: Theo dõi vị trí real-time

<!DOCTYPE HTML>
<html>
  <head>
    <script type="text/javascript">
      var watchID, geoLoc;
      function showLocation(position) {
        var lat = position.coords.latitude;
        var lon = position.coords.longitude;
        alert("Vĩ độ: " + lat + " Kinh độ: " + lon);
      }
      function errorHandler(err) {
        if (err.code == 1) alert("Lỗi: Truy cập bị từ chối!");
        else if (err.code == 2) alert("Lỗi: Vị trí không xác định!");
      }
      function getLocationUpdate() {
        if (navigator.geolocation) {
          var options = {timeout: 60000, enableHighAccuracy: true};
          geoLoc = navigator.geolocation;
          watchID = geoLoc.watchPosition(showLocation, errorHandler, options);
        } else {
          alert("Trình duyệt không hỗ trợ Geolocation!");
        }
      }
    </script>
  </head>
  <body>
    <form>
      <input type="button" onclick="getLocationUpdate();" value="Theo dõi vị trí"/>
    </form>
  </body>
</html>

Quyền riêng tư: Trình duyệt luôn hỏi phép người dùng trước khi chia sẻ vị trí. Cần HTTPS cho Geolocation hoạt động trên hầu hết trình duyệt hiện đại.