Echtzeit-GPS-Tracker auf JUST HTML / JS und Google Maps auf einem Handphone ausgeführt werden? Ist es möglich?

Ja, es ist möglich. Die meisten Browser in der neuesten smartphones implementiert haben, die W3C-Geolocation-API:

Die Geolocation-API definiert eine high-level-Schnittstelle, um Position Informationen im Zusammenhang nur mit dem Gerät-hosting die Umsetzung, wie breiten-und Längengrad. Die API selbst ist gebunden an die zugrunde liegenden Standortdaten Quellen. Häufige Quellen von Informationen Ort zählen das Global Positioning System (GPS) und Lage abgeleitet von Netzwerk-Signale, wie z.B. IP-Adresse, RFID -, WiFi-und Bluetooth-MAC-Adressen und GSM/CDMA Zelle IDs, sowie Benutzereingaben. Es wird keine Garantie gegeben, dass die API gibt das Gerät die tatsächliche Lage.

Die API ist so konzipiert, dass sowohl "one-shot" - position Anfragen und wiederholt position updates, sowie die Möglichkeit zur expliziten Abfrage der Cache-Positionen.

Mithilfe der Geolocation-API zum zeichnen einen Punkt auf Google Maps, wird in etwa so Aussehen:

if (navigator.geolocation) { 
  navigator.geolocation.getCurrentPosition(function(position) {  

    var point = new google.maps.LatLng(position.coords.latitude, 
                                       position.coords.longitude);

    //Initialize the Google Maps API v3
    var map = new google.maps.Map(document.getElementById('map'), {
       zoom: 15,
      center: point,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });

    //Place a marker
    new google.maps.Marker({
      position: point,
      map: map
    });
  }); 
} 
else {
  alert('W3C Geolocation API is not available');
} 

Den oben erfasst nur die position einmal, und wird nicht automatisch aktualisiert, wenn Sie anfangen sich zu bewegen. Behandeln, die, würden Sie benötigen, um einen Verweis auf die marker, die in regelmäßigen Abständen rufen die getCurrentPosition() Methode, und bewegen Sie den marker auf die neuen Koordinaten. Der code könnte wie folgt Aussehen:

//Initialize the Google Maps API v3
var map = new google.maps.Map(document.getElementById('map'), {
  zoom: 15,
  mapTypeId: google.maps.MapTypeId.ROADMAP
});

var marker = null;

function autoUpdate() {
  navigator.geolocation.getCurrentPosition(function(position) {  
    var newPoint = new google.maps.LatLng(position.coords.latitude, 
                                          position.coords.longitude);

    if (marker) {
      //Marker already created - Move it
      marker.setPosition(newPoint);
    }
    else {
      //Marker does not exist - Create it
      marker = new google.maps.Marker({
        position: newPoint,
        map: map
      });
    }

    //Center the map on the new position
    map.setCenter(newPoint);
  }); 

  //Call the autoUpdate() function every 5 seconds
  setTimeout(autoUpdate, 5000);
}

autoUpdate();

Nun, wenn, indem Sie tracking bedeutet, dass Sie sollten auch speichern diese Informationen auf einem server (so dass jemand anderes sehen konnte, bewegen Sie sich von einem entfernten Standort aus), dann hätten Sie senden die Punkte zu einem server-side script mit AJAX.

Darüber hinaus stellen Sie sicher, dass die Google Maps API-Nutzungsbedingungen ermöglichen, diese Verwendung, bevor Sie sich in solch ein Projekt.

UPDATE: Die W3C Geolocation API eine watchPosition() Methode kann verwendet werden, anstelle der setTimeout() Mechanismus ist, den wir im obigen Beispiel.

InformationsquelleAutor der Antwort Daniel Vassallo