Aktualisieren Sie den Marker-Standort mit der Flyout-API

Will ich bauen web-app mit der Broschüre API. Ersten mein Benutzer ist geolocated mit der IP dann, wenn er annimmt, ich versuche zu aktualisieren, seine position mit HTML5-geolocation (Genauigkeit besser).

Mein problem ist, dass die marker-position wird nicht aktualisiert, auf die Karte und der code Balg kann nicht mit keine Fehler. Ich habe versucht hundert unterschiedliche syntax und Methoden aus Merkblatt Dokumentation zu aktualisieren marker-position (dh. setLatLng), aber ich war nicht erfolgreich. Ich würde gerne verstehen, was ist Los mit meinem code.

Mein problem ist gelöst, durch das tun so :

    var lat = (e.latlng.lat);
    var lng = (e.latlng.lng);
    var newLatLng = new L.LatLng(lat, lng);
    marker.setLatLng(newLatLng);

Alte code war:

//initial IP based geolocation

var lat = google.loader.ClientLocation.latitude;
var lng = google.loader.ClientLocation.longitude;

//place marker on the map

var marker = L.marker([lat,lng]).addTo(map);

//start HTML5 geolocation 

map.locate({setView: true, maxZoom: 16});

function onLocationFound(e) {

    var marker = L.marker([e.latlng.lat,e.latlng.lng]).update(marker);
    alert ('New latitude is ' + e.latlng.lat)
}

map.on('locationfound', onLocationFound);
Kommentar zu dem Problem
wenn ich addTo(map) erstellen Sie einen neuen marker, aber kein update des bestehenden. Irgendeine Idee ? Kommentarautor: floflo

InformationsquelleAutor der Frage floflo | 2013-01-05

  1. 31

    Den code in deine Frage ist ein wenig verwirrend, es ist schwer zu sagen, was das Problem ist, wenn man nur post-snippets.

    Als es ist, diesen code:

        var lat = (e.latlng.lat);
    var lng = (e.latlng.lng);
    var newLatLng = new L.LatLng(lat, lng);
    marker.setLatLng(newLatLng);

    ..sollte funktionieren wie erwartet innerhalb onLocationFound().

    Können Sie vereinfachen es:

    marker.setLatLng(e.latlng);

    Aber ich denke das problem ist ein Rahmen-Thema, werden einige der Variablen (z.B. marker) ist nicht zugänglich im inneren onLocationFound.

    Hier ein Beispiel, wie es zu erreichen:

    function init(){
    var map             = L.map('map', {center: [51.505, -0.09], zoom: 13}),
        marker          = L.marker(map.getCenter()).addTo(map),
        glcl            = google.loader.ClientLocation,
        onLocationfound = function(e){
          marker.setLatLng(e.latlng);
          map.setView(marker.getLatLng(),map.getZoom()); 
          alert('Marker has been set to position :'+marker.getLatLng().toString());
        };

    L.tileLayer('http://{s}.tile.cloudmade.com/[yourCloudmadeKey]/997/256/{z}/{x}/{y}.png').addTo(map);

    map.on('locationfound', onLocationfound);

    if(glcl){//when google.loader.ClientLocation contains result
       onLocationfound({latlng:[glcl.latitude,glcl.longitude]});
    }else{alert('google.loader.ClientLocation fails');}

    map.locate();
}

    Demo: http://jsfiddle.net/doktormolle/6ftGz/

    InformationsquelleAutor der Antwort Dr.Molle

  2. 5

    Versuchen update() der marker-Methode klappt es bei mir

    var lat = (e.latlng.lat);
var lng = (e.latlng.lng);
marker.setLatLng([lat, lng]).update();  //Updates your defined marker position

    InformationsquelleAutor der Antwort Kedar.Aitawdekar

Schreibe einen Kommentar