传单如何更新用户位置标记实时

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; 
    } 
});