..


Enllaços patrocinats

Geolocalització amb HTML5 i javascript. La integració amb Google Maps

Article escrit per Max Bossi
Pàgina 1 de 3

Productes nous s'estan introduint amb HTML5 són molts i alguns particularment interessant. Entre elles destaca, sens dubte, el suport a la geolocalització, que pot detectar automàticament la ubicació geogràfica de l'usuari a través del navegador.

L'ús de geolocalització, de fet, amb suport per HTML5 navegadors són capaços de rastrejar la ubicació de l'usuari utilitzant l'adreça IP assignada per la seva connexió amb l'ISP, la proximitat a la comunicació mòbil (per a la connexió mòbil) oa través de "la L'antena GPS pot ser integrat en el dispositiu. La detecció de la posició georafica, per descomptat, es produeix només després consentiment exprés de la persona en qüestió (que es notifiqui la sol.licitud de la pàgina web per fer el seguiment de la posició, una petició que serà capaç de donar el seu consentiment o no).

La ubicació retornat pel cercador s'expressa mitjançant les seves coordenades (latitud i longitud) que pot ser utilitzada per JavaScript. La nova API de geolocalització es basa en una nova propietat de l'objecte de navegador: navigator.geolocation.

Per tal de comprovar si el navegador suporta aquestes noves API de HTML5 és suficient, per tant, amb la condició fer una crida com aquesta:






 if (navigator.geolocation) {



  



 / / En el navegador llista amb suport per HTML5 geolocalització







 Else {}



  



 / / No hi ha suport per geolocalització







 }



Aquí tens un simple codi Javascript (que s'insereix en la capçalera de la pàgina) per a la detecció de coordenades geogràfiques dels usuaris:






 if (navigator.geolocation) {



  



 navigator.geolocation.getCurrentPosition (mia_posizione);







 Else {}



  



 alert ("La geo-lloc no és possible ');







 }









 mia_posizione funció () {



  



 var lat = position.coords.latitude;



  



 var lon = position.coords.longitude;



  



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

  





 }



En el cos de la pàgina no només cal inserir un element amb id "posició" dins del qual es coordina l'escrit per l'usuari.

Per veure un exemple de treball , feu clic aquí .

GetCurrentPosition funció ()

Com es pot veure si el seu navegador és compatible amb les venes de geolocalització getCurrentPosition crida a la funció () que, en el nostre exemple, es passa un argument com la devolució de trucada en cas d'èxit.
En realitat això funciona admet tres paràmetres:

  • de devolució de trucada en cas d'èxit;
  • De devolució de trucada en cas de fallada;
  • opcions:
    • enableHighAccuracy: veritable o fals, és demanar el dispositiu per enviar la localització amb el major nivell de precisió (attivamndo, per exemple, el dispositiu GPS);
    • Temps d'espera: la durada màxima d'espera per a la detecció de la posició (en milisegons);
    • maximumAge: edat màxima després que la detecció s'ha de realitzar el seguiment de NUVO posició;

Heus aquí un exemple de l'ús d'un getCurrentPosition () amb els tres paràmetres permesos:

 



 navigator.geolocation.getCurrentPosition (



  



 success_callback, error_callback, {enableHighAccuracy: false});

 
A la mateixa categoria ...
E-Learning
CSS (Curs) CSS (Curs)
Disseny Web i d'accessibilitat d'acord amb W3C CSS i XHTML. A partir de 29 €.
HTML (del curs) HTML (del curs)
El llenguatge de marcat per a la web des de 29 €.
Javascript (Curs) Javascript (Curs)
Guia completa de scripting del costat del client. A partir de 39 €.
Enllaços patrocinats