Uso de geolocalización

La API de geolocalización permite al usuario compartir su ubicación a las aplicaciones web si así lo desea. Por razones de privacidad, al usuario se le pide que confirme el permiso para proporcionar información de ubicación.

El objeto geolocation

La API de geolocalización se publica a través del objeto navigator.geolocation.

Si el objeto existe, los servicios de geolocalización están disponibles. Se puede comprobar la presencia de la geolocalización de esta manera:

if ("geolocation" in navigator) {
  /* geolocation is available */
} else {
  /* geolocaiton IS NOT available */
}

Obtención de la ubicación actual

Para obtener la ubicación actual del usuario, puede llamar al método getCurrentPosition().

Esto inicia una solicitud asíncrona para detectar la posición del usuario, y consulta el hardware de posicionamiento para obtener información actualizada. Cuando se determina la posición, se ejecuta la función de callback. Si lo desea, puede proporcionar otra función de callback que se ejecuta si se produce un error. Un tercer parámetro opcional, es un objeto de opciones donde se puede establecer la edad máxima de la posición devuelta, el tiempo de espera para una solicitud y si se requiere una alta precisión para la posición.

navigator.geolocation.getCurrentPosition(function(position) {
  do_something(position.coords.latitude, position.coords.longitude);
});

En el ejemplo anterior la función do_something() será ejecutada una vez que se obtiene la posición.

Rastreando la posición actual

Si los datos de ubicación cambian (si el dispositivo se mueve o información geográfica más precisa es recibida), puede definir una función de callback que se ejecuta al cambiar la posición. Esto se logra a través de la función watchPosition(), que recibe los mismos parámetros que getCurrentPosition(). La función de callback es ejecutada varias veces, permitiendo al navegador actualizar la ubicación cada vez que cambia, o proporcionar una posición con mayor exactitud utilizando distintas técnicas de geolocalización. La función de callback de error, la cual es opcional como en getCurrentPosition(), es llamada solo una vez, cuando nunca serán devueltos resultados correctos.

var watchID = navigator.geolocation.watchPosition(function(position) {
  do_something(position.coords.latitude, position.coords.longitude);
});

El método watchPosition() devuelve un número que se utiliza para identificar el rastreador de posición solicitado; este valor se utiliza junto con el método clearPosition() para dejar de rastrear la posición del usuario.

navigator.geolocation.clearWatch(watchID);

Afinando la respuesta

Ambos métodos,  getCurrentPosition() y watchPosition() aceptan una función de callback en caso de éxito, una función callback opcional si ocurre algún error, y un objeto PositionOptions también opcional.

Una llamada a watchPosition luce como el siguiente ejemplo:

function geo_success(position) {
  do_something(position.coords.latitude, position.coords.longitude);
}

function geo_error() {
  alert("Sorry, no position available.");
}

var geo_options = {
  enableHighAccuracy: true, 
  maximumAge        : 30000, 
  timeout           : 27000
};

var wpid = navigator.geolocation.watchPosition(geo_success, geo_error, geo_options);

Demo de watchPosition: https://www.thedotproduct.org/experiments/geo/


Describiendo una posición

La ubicación del usuario es descrita con un objeto Position referenciando a un objeto Coordinates.

Manejo de errores

La función de callback de error, si existe cuando se llama a getCurrentPosition() o watchPosition(), recibe un objeto  PositionError como su primer parámetro.

function errorCallback(error) {
  alert('ERROR(' + error.code + '): ' + error.message);
};

Ejemplo de geolocalización

body {
  padding: 20px;
  background-color:#ffffc9
}

p { margin : 0; }

Contenido HTML

<p><button onclick="geoFindMe()">Show my location</button></p>
<div id="out"></div>

Contenido JavaScript

function geoFindMe() {
  var output = document.getElementById("out");

  if (!navigator.geolocation){
    output.innerHTML = "<p>Geolocation is not supported by your browser</p>";
    return;
  }

  function success(position) {
    var latitude  = position.coords.latitude;
    var longitude = position.coords.longitude;

    output.innerHTML = '<p>Latitude is ' + latitude + '° <br>Longitude is ' + longitude + '°</p>';

    var img = new Image();
    img.src = "https://maps.googleapis.com/maps/api/staticmap?center=" + latitude + "," + longitude + "&zoom=13&size=300x300&sensor=false";

    output.appendChild(img);
  };

  function error() {
    output.innerHTML = "Unable to retrieve your location";
  };

  output.innerHTML = "<p>Locating…</p>";

  navigator.geolocation.getCurrentPosition(success, error);
}

Resultado

Compatibilidad entre navegadores

Notas sobre Gecko

Firefox incluye soporte para localizar basándose en información de redes inalámbricas, usando Google Location Services. En la transacción entre Firefox y Google, los datos son compartidos incluyendo información del punto de acceso inalámbrico, un token de acceso (similar a una cookie con duración de dos semanas), y la dirección IP del usuario. Para más información, por favor consulte la Política de Privacidad de Mozilla y la Política de Privacidad de Google, dichos documentos cubren como estos datos pueden ser utilizados.

En Firefox 3.6 (Gecko 1.9.2) fue añadido soporte para utilizar el servicio GPSD para geolocalización en sistemas Linux.

Consultar también

• navigator.geolocation
• API de Geolocalización en w3.org
• Demos que utilizan la API de Geolocalización