傳單如何更新用戶位置標記實時

Question

我正在嘗試更新傳單中的用戶位置。例如，當用戶帶着手機走路時，他們的位置標記也會根據位置數據移動，就像谷歌地圖一樣。

現在我只是把一個標記上他們的初始位置

this.map.locate({ 
    setView: true, 
    maxZoom: 120 
}).on("locationfound", e => { 

    leaflet.marker([e.latitude, e.longitude]).bindPopup("YOU ARE HERE!").addTo(this.map); 



    console.log("lokasyon bulundu"); 
}).on("locationerror", error => { 

    console.log("lokasyon bulunamadi"); 
}); 

嘗試update（）方法，但不可能讓它幹活想我應該採取用戶位置數據，每一秒，如果不同，則吸引新標記並刪除舊的？這是一種有效的方式嗎？

謝謝 編輯這是我嘗試根據答案。它從數據庫不working.im提取數據，並基於該判斷的自定義標記

this.map.locate({ 
    setView: true, 
    maxZoom: 120, 
    watch:true, 
    enableHighAccuracy:true 
    }).on("locationfound", e => { 
     if (!usermarker) { 

     if(this.profileData.avatar == "https://i.hizliresim.com/zJJ239.png"){ 
      usermarker = new L.marker(e.latlng,{icon : ayi}).addTo(this.map); 
     }else if(this.profileData.avatar == "https://i.hizliresim.com/mJJrkP.png"){ 
      usermarker = new L.marker(e.latlng,{icon : ironman}).addTo(this.map); 
     }else if(this.profileData.avatar == "https://i.hizliresim.com/vJJQpp.png"){ 
      usermarker = new L.marker(e.latlng,{icon : dino}).addTo(this.map); 
     }else if(this.profileData.avatar == "https://i.hizliresim.com/zJJ2B9.png"){ 
      usermarker = new L.marker(e.latlng,{icon : petyr}).addTo(this.map); 
     } 
     } else if(this.profileData.avatar == "https://i.hizliresim.com/zJJ239.png") { 
      usermarker.setLatLng(e.latlng); 
     } 
    }).on("locationerror", error => { 
     if (usermarker) { 
      map.removeLayer(usermarker); 
      usermarker = undefined; 
     } 
    }); 

Answer 1

只是檢查是否有創建一個標誌，如果沒有創建它，否則使用L.Marker的setLatLng方法更新：

將標記位置更改爲給定點。

參考：http://leafletjs.com/reference-1.2.0.html#marker-setlatlng

例子：

var marker; 

this.map.locate({ 
    setView: true, 
    maxZoom: 120 
}).on("locationfound", e => { 
    if (!marker) { 
     marker = new L.marker(e.latlng).addTo(this.map); 
    } else { 
     marker.setLatLng(e.latlng); 
    } 
}).on("locationerror", error => { 
    if (marker) { 
     map.removeLayer(marker); 
     marker = undefined; 
    } 
});