Geolocatie met HTML5 en javascript. Integratie met Google Maps

Nieuwe producten worden geïntroduceerd met HTML5 zijn talrijk en enkele bijzonder interessant. Onder deze valt op, zonder twijfel, ondersteuning voor geolocatie, die automatisch kan detecteren van de gebruiker de geografische locatie via de browser.

Met behulp van geolocatie, in feite, met ondersteuning voor HTML5 browsers zijn in staat om de locatie van de gebruiker met behulp van het IP-adres toegewezen door uw ISP-verbinding, de nabijheid tot cel communicatie (voor mobiele verbinding) spoor of via de " GPS-antenne kan worden geïntegreerd in het apparaat. De positie detectie georafica, natuurlijk, geschiedt na uitdrukkelijke toestemming van de betrokkene (die wordt in kennis gesteld van het verzoek van de webpagina om het volgen van de positie, een aanvraag die in staat zal zijn om toestemming te maken of niet).

De locatie wordt geretourneerd door de browser wordt uitgedrukt door de coördinaten (lengte-en breedtegraad), die vervolgens kunnen worden gebruikt door JavaScript. De nieuwe geolocatie-API is gebaseerd op een nieuwe eigenschap van de navigator object: navigator.geolocation.

Om te controleren of de browser biedt ondersteuning voor deze nieuwe API voor HTML5 is voldoende, daarom voorwaardelijk een gesprek als volgt:

 if (navigator.geolocation) {



  



 / / Browser-ready met ondersteuning voor HTML5 geolocatie







 Else {}



  



 / / Geen ondersteuning voor geolocatie







 }

Hier is een aantal eenvoudige Javascript code (in te voegen in de header van de pagina) voor de detectie van de geografische coördinaten van de gebruiker:

 if (navigator.geolocation) {



  



 navigator.geolocation.getCurrentPosition (mia_posizione);







 Else {}



  



 alert ('De geo-lokalisatie niet mogelijk is');







 }









 mia_posizione function () {



  



 var lat = position.coords.latitude;



  



 var lon = position.coords.longitude;



  



 document.getElementById ('location') innerHTML = 'Uw functie:'. + lat + ',' + lon;

  





 }

In het lichaam van de pagina niet alleen om een ​​element te voegen met id "positie" in, die de gebruiker coördinaten zal worden geschreven.

Om te zien een werkend voorbeeld klik hier .

GetCurrentPosition function ()

Zoals je kunt zien of uw browser ondersteunt Geolocation getCurrentPosition aderen heet de functie (), die in ons voorbeeld, een argument wordt doorgegeven als het terugbellen op succes.
Eigenlijk is dit werk geeft drie parameters:

• terugbellen op succes;
• Terugbellen bij falen;
• opties:
  • enableHighAccuracy: waar of onwaar is, wordt het apparaat verzoek om de locatie te sturen met de hoogste graad van nauwkeurigheid (attivamndo, bijvoorbeeld, het GPS-apparaat);
  • timeout: maximale duur van het wachten voor de detectie van de positie (in milliseconden);
  • maximumAge: maximale leeftijd, waarna de detectie moet worden uitgevoerd Nuvo positie tracking;

Hier is een voorbeeld van het gebruik van een getCurrentPosition () met alle toegestane drie parameters:

 



 navigator.geolocation.getCurrentPosition (



  



 success_callback, error_callback, {enableHighAccuracy: false});

 

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