45. Geolocation trong HTML

Geolocation trong HTML cho phép bạn truy cập thông tin về vị trí địa lý của người dùng thông qua trình duyệt. Bạn có thể sử dụng Geolocation API để xác định vị trí của người dùng dựa trên hệ thống định vị GPS hoặc các cách khác như Wi-Fi hoặc dịch vụ địa lý của ISP. Dưới đây là một ví dụ về cách sử dụng Geolocation API để hiển thị vị trí địa lý của người dùng:

html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Geolocation Example</title>
</head>
<body>
    <h1>Geolocation Example</h1>
    
    <p>Your current location is:</p>
    <p id="location"></p>
    
    <script>
        if ("geolocation" in navigator) {
            navigator.geolocation.getCurrentPosition(function(position) {
                const latitude = position.coords.latitude;
                const longitude = position.coords.longitude;
                const locationElement = document.getElementById("location");
                locationElement.textContent = "Latitude: " + latitude + ", Longitude: " + longitude;
            });
        } else {
            const locationElement = document.getElementById("location");
            locationElement.textContent = "Geolocation is not supported by this browser.";
        }
    </script>
</body>
</html>

Trong ví dụ trên:

  • Chúng ta sử dụng navigator.geolocation.getCurrentPosition() để lấy thông tin vị trí hiện tại của người dùng.
  • position.coords.latitudeposition.coords.longitude cung cấp thông tin về vĩ độ và kinh độ của vị trí.
  • Nếu trình duyệt không hỗ trợ Geolocation API, chúng tôi hiển thị thông báo tương ứng.

Lưu ý rằng trước khi trình duyệt cho phép bạn truy cập vị trí của người dùng, người dùng sẽ được yêu cầu cung cấp sự cho phép thông qua một cửa sổ xác nhận.

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top