GeolocationCoordinates: thuộc tính longitude

Giá trị

Giá trị trong longitude là kinh độ địa lý của vị trí trên Trái Đất do đối tượng Coordinates mô tả, tính bằng độ thập phân. Giá trị này được xác định bởi đặc tả World Geodetic System 1984 (WGS 84).

Ví dụ

Trong ví dụ đơn giản này, chúng ta lấy vị trí của người dùng và hiển thị các tọa độ thu được sau khi chúng được trả về.

JavaScript

Mã JavaScript bên dưới tạo một trình lắng nghe sự kiện để khi người dùng nhấp vào một nút, thông tin vị trí sẽ được lấy và hiển thị.

let button = document.getElementById("get-location");
let latText = document.getElementById("latitude");
let longText = document.getElementById("longitude");

button.addEventListener("click", () => {
  navigator.geolocation.getCurrentPosition((position) => {
    let lat = position.coords.latitude;
    let long = position.coords.longitude;

    latText.innerText = lat.toFixed(2);
    longText.innerText = long.toFixed(2);
  });
});

Sau khi thiết lập các biến để tham chiếu thuận tiện hơn đến phần tử nút và hai phần tử sẽ được dùng để hiển thị vĩ độ và kinh độ, trình lắng nghe sự kiện được thiết lập bằng cách gọi addEventListener() trên phần tử <button>. Khi người dùng nhấp vào nút, chúng ta sẽ lấy và hiển thị thông tin vị trí.

Khi nhận một sự kiện click, chúng ta gọi getCurrentPosition() để yêu cầu vị trí hiện tại của thiết bị. Đây là một yêu cầu bất đồng bộ, vì vậy chúng ta cung cấp một callback nhận vào một đối tượng GeolocationPosition mô tả vị trí đã xác định.

Từ đối tượng GeolocationPosition, chúng ta lấy vĩ độ và kinh độ của người dùng bằng position.coords.latitude và position.coords.longitude để có thể cập nhật các tọa độ đã hiển thị. Hai phần tử <span> được cập nhật để hiển thị các giá trị tương ứng sau khi được chuyển sang giá trị có hai chữ số thập phân.

HTML

HTML được dùng để hiển thị kết quả trông như sau:

<p>
  Your location is <span id="latitude">0.00</span>° latitude by
  <span id="longitude">0.00</span>° longitude.
</p>
<button id="get-location">Get My Location</button>

Kết quả

Hãy thử ví dụ này tại đây:

Thông số kỹ thuật

Tương thích trình duyệt

Xem thêm

• Sử dụng Geolocation API
• Giao diện GeolocationCoordinates mà nó thuộc về.
• Giao diện GeolocationPosition, là giao diện cấp cao nhất được dùng để trả về dữ liệu geolocation từ các hàm của Geolocation API Geolocation.getCurrentPosition() và watchPosition().