2

場所が更新されるたびに、既存のマーカーを移動する代わりに新しいマーカーが配置されます。アプリケーションがその位置を更新するたびに新しいマーカーを配置するのではなく、画面に1つのマーカーを表示したかっただけです(最大年齢と頻度を無視して、何かをテストしていて、それらが問題ではないことを知っています)。前もって感謝します。

(マップをロードするコード)

    function onLocationFound(e) {

                                var marker= L.icon({iconUrl: 'greendot.png'});
    var radius = e.accuracy /2;

    L.marker(e.latlng, {icon: marker}).addTo(map).bindPopup("You are within " + radius + " meters from this point").openPopup();



                                  }

    function onLocationError(e) {
        alert(e.message);
    }


    map.on('locationfound', onLocationFound);
    map.on('locationerror', onLocationError);

    map.locate({watch: true, setView: true, maxZoom: 16, enableHighAccuracy: true, maximumAge:10000, frequency: 1});

編集:いくつかの解決策を試しましたが、マーカーはまだ動かず、新しいものを追加するだけです。何か案は?

4

1 に答える 1

2

毎回新しいマーカーを作成する代わりに、既存のマーカーを更新できます。

var marker = L.icon({iconUrl: 'greendot.png'});
var movingMarker = L.marker([0,0], 0, {icon: marker}).addTo(map);

function onLocationFound(e) {
    var radius = e.accuracy /2;
    movingMarker.setLatLng(e.latlng);
    movingMarker.unbindPopup();
    movingMarker.bindPopup("You are within " + radius + " meters from this point")
    movingMarker.redraw();
}

function onLocationError(e) {
    alert(e.message);
}

map.on('locationfound', onLocationFound);
map.on('locationerror', onLocationError);

map.locate({watch: true, setView: true, maxZoom: 16, enableHighAccuracy: true, maximumAge: 10000});

同様の質問を見つけました(同様の回答があります):リーフレットAPIでマーカーの位置を更新します

于 2015-05-06T07:21:39.067 に答える