L'API HTML Géolocalisation est utilisé pour localiser la position d'un utilisateur.
-
Qu'est-ce que API W3C Géolocalisation?
L'API W3C Géolocalisation est un effort par le Wide Web Consortium (W3C) pour normaliser une interface pour récupérer les informations de localisation géographique pour un dispositif côté client.
Il définit un ensemble d'objets, conforme à la norme ECMAScript, que l'exécution dans l'application client donne l'emplacement de l'appareil du client par le conseil de l'emplacement des serveurs d'information, qui sont transparents pour l'interface de programmation d'applications (API).
Les sources les plus courantes d'informations de localisation sont l'adresse IP, une connexion Wi-Fi et l'adresse MAC Bluetooth, l'identification par radiofréquence (RFID), l'emplacement de connexion Wi-Fi, ou un dispositif système de positionnement global (GPS) et les ID cellulaires GSM / CDMA.
L'emplacement est retourné avec une précision donnée en fonction de la meilleure source d'informations de localisation disponibles.
Déploiement dans les navigateurs web
Les pages Web peuvent utiliser directement l'API Géolocalisation si le navigateur Web implémente. Historiquement, certains navigateurs pourraient obtenir un soutien via le plug-in Google Gears, mais cela a été abandonné en 2010 et l'API côté serveur, il dépendait cessé de répondre en 2012.
L'API de géolocalisation est idéal pour les applications Web pour les appareils mobiles tels que les assistants numériques personnels (PDA) et les téléphones intelligents. Sur les ordinateurs de bureau, l'API W3C Géolocalisation fonctionne dans Firefox depuis la version 3.5, Google Chrome, Opera 10.6, Internet Explorer 9.0 et Safari 5. Sur les appareils mobiles, il fonctionne sur Android (firmware 2.0+), iOS, Windows Phone et Maemo.
L'API W3C Géolocalisation est également soutenu par Opera Mobile 10.1 - disponible pour les appareils Android et Symbian (S60 générations 3 et 5) depuis le 24 Novembre 2010.
Google Gears a fourni un soutien de géolocalisation pour les anciens navigateurs et non conformes, y compris Internet Explorer 7.0+ comme un plug-in Gears et Google Chrome qui mettait en œuvre Gears nativement. Elle a également pris en charge la géolocalisation sur les appareils mobiles comme un plug-in pour le navigateur Android (version 2.0 avant) et Opera Mobile pour Windows Mobile.
Cependant, l'API Google Gears est incompatible avec Geolocalisation l'API W3C Géolocalisation et ne sont plus pris en charge.
Caractéristiques
Le résultat de l'API W3C Géolocalisation généralement donner 4 propriétés d'emplacement, y compris la latitude et la longitude (coordonnées), l'altitude (hauteur), et [précision de la position recueillie], qui dépendent tous les sources de localisation.
Dans certaines requêtes, l'altitude peut donner ou retourner aucune valeur.
Localisez la position de l'utilisateur
L'API HTML Géolocalisation est utilisée pour obtenir la position géographique d'un utilisateur.
Étant donné que cela peut compromettre la vie privée, la position est disponible uniquement si l'utilisateur approuve.
Support du navigateur
Les chiffres du tableau indiquent la première version du navigateur qui prend en charge entièrement Géolocalisation.
| API | |||||
|---|---|---|---|---|---|
| Geolocation | 5.0 | 9.0 | 3.5 | 5.0 | 16,0 |
Note: La géolocalisation est beaucoup plus précis pour les appareils avec GPS, comme l' iPhone .
En utilisant HTML Géolocalisation
Le getCurrentPosition() méthode est utilisée pour obtenir la position de l'utilisateur.
L'exemple retourne en dessous de la latitude et la longitude de la position de l'utilisateur:
Exemple
<script>
var x = document.getElementById("demo");
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(showPosition);
} else {
x.innerHTML = "Geolocation is not supported by this browser.";
}
}
function showPosition(position) {
x.innerHTML = "Latitude: " + position.coords.latitude +
"<br>Longitude: " + position.coords.longitude;
}
</script> Essayez vous - même » Exemple expliqué:
- Vérifiez si Géolocalisation est pris en charge
- Si pris en charge, exécutez la getCurrentPosition() méthode. Sinon, afficher un message à l'utilisateur
- Si le getCurrentPosition() méthode est couronnée de succès, il renvoie un objet coordonnées à la fonction spécifiée dans le paramètre (showPosition)
- La showPosition() sorties de fonction Latitude et Longitude
L'exemple ci-dessus est un script de géolocalisation très basique, sans traitement des erreurs.
Gestion des erreurs et les rejets
Le second paramètre du getCurrentPosition() méthode est utilisée pour gérer les erreurs. Il spécifie une fonction à exécuter si elle ne parvient pas à obtenir l'emplacement de l'utilisateur:
Exemple
function showError(error) {
switch(error.code) {
case error.PERMISSION_DENIED:
x.innerHTML = "User denied the request for Geolocation."
break;
case error.POSITION_UNAVAILABLE:
x.innerHTML = "Location information is unavailable."
break;
case error.TIMEOUT:
x.innerHTML = "The request to get user location timed out."
break;
case error.UNKNOWN_ERROR:
x.innerHTML = "An unknown error occurred."
break;
}
} Essayez vous - même » Affichage du résultat dans une carte
Pour afficher le résultat sur une carte, vous devez avoir accès à un service de carte, comme Google Maps.
Dans l'exemple ci - dessous, la latitude et la longitude de retour est utilisé pour indiquer l'emplacement dans une carte Google (using a static image) en (using a static image) :
Exemple
function showPosition(position) {
var latlon = position.coords.latitude + "," + position.coords.longitude;
var img_url = "http://maps.googleapis.com/maps/api/staticmap?center=
"+latlon+"&zoom=14&size=400x300&sensor=false";
document.getElementById("mapholder").innerHTML = "<img src='"+img_url+"'>";
} Essayez vous - même » Google Map Script
Comment afficher une carte Google interactive avec un marqueur, zoom et des options de glisser.
Informations spécifiques à l'emplacement
Cette page a démontré comment afficher la position d'un utilisateur sur une carte.
La géolocalisation est également très utile pour obtenir des informations spécifiques au lieu, comme:
- La mise à jour de l'information locale
- Affichage Points d'intérêt près de l'utilisateur
- Turn-by-turn navigation (GPS)
Le getCurrentPosition() Méthode - Retour de données
Le getCurrentPosition() si elle est réussie méthode retourne un objet. La latitude, la longitude et les propriétés de précision sont toujours retournés. Les autres propriétés sont retournées si elles sont disponibles:
| Propriété | Résultats |
|---|---|
| coords.latitude | La latitude en tant que nombre décimal |
| coords.longitude | La longitude comme nombre décimal |
| coords.accuracy | La précision de la position |
| coords.altitude | L'altitude en mètres au-dessus du niveau moyen de la mer |
| coords.altitudeAccuracy | La précision de l'altitude de la position |
| coords.heading | Le cap en degrés dans le sens horaire du Nord |
| coords.speed | La vitesse en mètres par seconde |
| timestamp | La date / heure de la réponse |
objet Geolocation - Autres méthodes intéressantes
watchPosition() - Retourne la position actuelle de l'utilisateur et continue de revenir position mise à jour que l'utilisateur se déplace (like the GPS in a car) .
clearWatch() - Arrête le watchPosition() méthode.
L'exemple ci - dessous montre la watchPosition() méthode. Vous avez besoin d' un dispositif GPS précis pour tester cette (like iPhone ) l' (like iPhone ) :
Exemple
<script>
var x = document.getElementById("demo");
function getLocation() {
if (navigator.geolocation) {
navigator.geolocation.watchPosition(showPosition);
} else {
x.innerHTML = "Geolocation is not supported by this browser.";
}
}
function showPosition(position) {
x.innerHTML = "Latitude: " + position.coords.latitude +
"<br>Longitude: " + position.coords.longitude;
}
</script> Essayez vous - même »