Geolocalización con HTML5 y javascript. La integración con Google Maps

Productos nuevos se están introduciendo con HTML5 son muchos y algunos particularmente interesante. Entre ellas destaca, sin duda, el apoyo a la geolocalización, que puede detectar automáticamente la ubicación geográfica del usuario a través del navegador.

El uso de geolocalización, de hecho, con soporte para HTML5 navegadores son capaces de rastrear la ubicación del usuario utilizando la dirección IP asignada por su conexión con el ISP, la proximidad a la comunicación celular (para la conexión móvil) oa través de "la La antena GPS puede ser integrado en el dispositivo. La detección de la posición georafica, por supuesto, se produce sólo después consentimiento expreso de la persona en cuestión (que será notificado de la solicitud de la página web para hacer el seguimiento de la posición, una petición que será capaz de dar su consentimiento o no).

La ubicación devuelto por el buscador se expresa mediante sus coordenadas (latitud y longitud) que puede ser utilizada por JavaScript. La nueva API de geolocalización se basa en una nueva propiedad del objeto de navegador: navigator.geolocation.

Con el fin de comprobar si el navegador ofrece soporte para estas nuevas API de HTML5 es suficiente, por lo tanto, con la condición hacer una llamada como esta:

 if (navigator.geolocation) {



  



 / / En el navegador lista con soporte para HTML5 geolocalización







 Else {}



  



 / / No hay soporte para geolocalización







 }

Aquí tienes un simple código Javascript (que se inserta en la cabecera de la página) para la detección de coordenadas geográficas de los usuarios:

 if (navigator.geolocation) {



  



 navigator.geolocation.getCurrentPosition (mia_posizione);







 Else {}



  



 alert ("La geo-localización no es posible ');







 }









 mia_posizione función () {



  



 var lat = position.coords.latitude;



  



 var lon = position.coords.longitude;



  



 document.getElementById ('location') innerHTML = 'Su posición: ". lat + +', '+ lon;

  





 }

En el cuerpo de la página no sólo hay que insertar un elemento con id "posición" dentro del cual se coordina el escrito por el usuario.

Para ver un ejemplo de trabajo , haga clic aquí .

GetCurrentPosition función ()

Como se puede ver si su navegador es compatible con las venas de geolocalización getCurrentPosition llama a la función () que, en nuestro ejemplo, se pasa un argumento como la devolución de llamada en caso de éxito.
En realidad esto funciona admite tres parámetros:

• de devolución de llamada en caso de éxito;
• De devolución de llamada en caso de fallo;
• opciones:
  • enableHighAccuracy: verdadero o falso, es solicitar el dispositivo para enviar la localización con el mayor nivel de precisión (attivamndo, por ejemplo, el dispositivo GPS);
  • Tiempo de espera: la duración máxima de espera para la detección de la posición (en milisegundos);
  • maximumAge: edad máxima después de que la detección se debe realizar el seguimiento de nuvo posición;

He aquí un ejemplo del uso de un getCurrentPosition () con los tres parámetros permitidos:

 



 navigator.geolocation.getCurrentPosition (



  



 success_callback, error_callback, {enableHighAccuracy: false});

 

• <<
• 1
• 2
• 3
• >>