La API
geolocationHTML se utiliza para localizar y/o ubicar la posición de un usuario.
Obten la posición del usuario
La API geolocation se utiliza para obtener la posición geográfica de un usuario.
Dado que esto puede comprometer la privacidad, la posición no está disponible a menos que el usuario lo apruebe.
Nota: la geolocalización es más precisa en dispositivos con GPS, como los teléfonos inteligentes.
Compatibilidad con el navegador
Los números en la siguiente tabla, especifican la primera versión del navegador compatible con geolocation:
| API | Chrome | Edge | Mozilla | Safari | Opera |
Geolocation | 5.0 - 49.0 (http)50.0 (https) | 9.0 | 3.5 | 5.0 | 16.0 |
Nota: a partir de Chrome 50, la API
geolocationsolo funcionará en contextos seguros como HTTPS. Si tu sitio web está alojado en un origen no seguro (como HTTP), las solicitudes para obtener la ubicación de los usuarios ya no funcionarán.
Uso de geolocalización
El método getCurrentPosition() se utiliza para devolver la posición del usuario.
El siguiente ejemplo devuelve la latitud y la longitud de la posición del usuario:
Ejemplo:
Ejemplo explicado:
Se verifica si
geolocationes compatible con el navegador.Si es compatible, ejecuta el método
getCurrentPosition(). Si no, muestra un mensaje al usuario.Si el método
getCurrentPosition()es exitoso, devuelve un objeto de coordenadas a la función especificada en el parámetro (showPosition).La función
showPositiongenerar la latitud y longitud.
👆El ejemplo anterior es un script de geolocalización muy básico, sin manejo de errores.
Manejo de errores
El segundo parámetro del método getCurrentPosition() se utiliza para manejar errores. Especifica una función para ejecutar si no puede obtener la ubicación del usuario:
Ejemplo:
Información especifica de una ubicación
Esta página ha demostrado cómo mostrar la posición de un usuario en un mapa.
La geolocalización también es muy útil para obtener información específica de la ubicación, como:
Información local en tiempo real
Mostrar puntos de interés cerca del usuario
Navegación paso a paso (GPS)
El método getCurrentPosition()
El método getCurrentPosition() devuelve un objeto exitoso. Las propiedades de latitud, longitud y precisión siempre retornan. Las otras propiedades retornan si están disponibles:
| Propiedad | Retorna |
coords.latitude | La latitud como número decimal (siempre devuelve) |
coords.longitude | La longitud como un número decimal (siempre devuelve) |
coords.accuracy | La precisión de la posición (siempre devuelve |
coords.altitude | La altitud en metros sobre el nivel medio del mar (devuelve si está disponible) |
coords.altitudeAccuracy | La precisión de altitud de la posición (devuelve si está disponible) |
coords.heading | El rumbo como grados en el sentido de las agujas del reloj desde el norte (devuelve si está disponible) |
coords.speed | La velocidad en metros por segundo (devuelve si está disponible) |
timestamp | La fecha/hora de la respuesta (devuelve si está disponible) |
Objeto de geolocalización - otros métodos
El objetoGeolocation también tiene otros métodos interesantes:
watchPositon()- devuelve la posición actual del usuario en tiempo real a medida que el usuario se mueve (como el GPS en un automóvil).clearWatch()- detiene el métodowatchPosition().
El siguiente ejemplo muestra el método watchPosition().
Ejemplo:
Resumen
La API geolocation HTML se utiliza para localizar y/o ubicar la posición de un usuario. Además de que contiene otras propiedades.
Traducido con 💚 desde W3Schools.com