Obtenir la position GPS à partir du navigateur Web

Je développe un site Web mobile, j'ai intégré Google Maps, je dois remplir le champ «De» de Google Maps de manière dynamique.

Est-il possible d'obtenir la position GPS à partir du navigateur Web et de la remplir dans le champ «De» d'une carte Google Map de manière dynamique?

Si vous utilisez l' API de géolocalisation , ce serait aussi simple que d'utiliser le code suivant.

navigator.geolocation.getCurrentPosition(function(location) {
  console.log(location.coords.latitude);
  console.log(location.coords.longitude);
  console.log(location.coords.accuracy);
});

Vous pouvez également utiliser l'API de localisation du client de Google .

Ce problème a été abordé dans Est-il possible de détecter la position GPS d'un navigateur mobile? et obtenir des données de position à partir du navigateur mobile . Vous pouvez trouver plus d'informations ici.

Pour donner une réponse un peu plus précise. HTML5 vous permet d'obtenir les coordonnées géographiques et fait un travail assez décent. Dans l'ensemble, le support du navigateur pour la géolocalisation est assez bon, tous les principaux navigateurs sauf ie7 et ie8 (et opera mini). IE9 fait le travail mais est le moins performant. Commander caniuse.com:

http://caniuse.com/#search=geol

Vous avez également besoin de l'approbation de votre utilisateur pour accéder à sa position, alors assurez-vous de vérifier cela et de donner des instructions décentes au cas où il serait désactivé. Surtout pour Iphone, l'activation des autorisations pour Safari est un peu lourde.

Utilisez ceci, et vous trouverez toutes les informations sur http://www.w3schools.com/html/html5_geolocation.asp

<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>

Il existe l' API GeoLocation , mais le support du navigateur est plutôt limité sur le terrain à l'heure actuelle. La plupart des sites qui se soucient de telles choses utilisent une base de données GeoIP (avec les réserves habituelles sur l'inexactitude d'un tel système). Vous pouvez également consulter les services tiers nécessitant la coopération des utilisateurs tels que FireEagle .

Observable

/*
  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);
  */
  getLocation(): Observable<Position> {
    return Observable.create((observer) => {
      const watchID = navigator.geolocation.watchPosition((position: Position) => {
        observer.next(position);
      });
      return () => {
        navigator.geolocation.clearWatch(watchID);
      };
    });
  }

  ngOnDestroy() {
    this.sub.unsubscribe();
  }

Utilisons les dernières fonctions de grosse flèche :

navigator.geolocation.getCurrentPosition((loc) => {
  console.log('The location in lat lon format is: [', loc.coords.latitude, ',', loc.coords.longitude, ']');
})