Hasta ahora hemos empleado el método getCurrentPosition para obtener la posición, existe otro método llamado watchPosition que tiene los mismos parámetros que getCurrentPosition con la diferencia que la función que recibe la posición se llama cada vez que se detecta que nos hemos desplazado.
Confeccionar una aplicación que inmediatamente arranque muestra la longitud, latitud y precisión. Actualizar dicha posición cada vez que cambie empleando para ello la llamada al método watchPosition.
Para probar este algoritmo es mejor hacerlo en un celular y desplazarnos para que se obtengan distintas posiciones.
<!DOCTYPE HTML>
<html>
<head>
<title>Título de la página</title>
<meta charset="UTF-8">
<script type="text/javascript">
window.addEventListener('load', inicio, false);
function inicio() {
if (navigator.geolocation) {
navigator.geolocation.watchPosition(mostrarCoordenada);
} else {
alert('El navegador no dispone la capacidad de geolocalización');
}
}
function mostrarCoordenada(posicion) {
document.getElementById('dato').innerHTML='Latitud:'+
posicion.coords.latitude+
'<br> Longitud:'+posicion.coords.longitude+
'<br>Exactitud:'+posicion.coords.accuracy;
}
</script>
</head>
<body>
<span id="dato"></span>
</body>
</html>
En la función inicio que se dispara una vez que la página se ha cargado completamente es que llamamos a watchPosition indicando la función que se ejecutará cada vez que cambiemos de posición:
function inicio() {
if (navigator.geolocation) {
navigator.geolocation.watchPosition(mostrarCoordenada);
} else {
alert('El navegador no dispone la capacidad de geolocalización');
}
}
El algoritmo que veíamos para mostrar la coordenada actual no cambia:
function mostrarCoordenada(posicion) {
document.getElementById('dato').innerHTML='Latitud:'+
posicion.coords.latitude+
'<br> Longitud:'+posicion.coords.longitude+
'<br>Exactitud:'+posicion.coords.accuracy;
}