如何构建带有可拖动标记的 Leaflet 控件（拖动时更新 lat/long）和 lat/long 形式的自动更新值

Question

我有现有的代码，它已经用定位控件和自动更新 lat/long 构建在价值 Web 表单中（见附件）现在我想在检测到我的位置时添加一个可拖动的制造商，并在制造商针点将焦点更改为定位控制功能时自动更新 lat/long。我的搜索控制功能按预期工作，它使用 markerz 作为制造商。

这是我现有的代码：

<script type="text/javascript">
var mymap = L.map(\'dvMap\').setView(['. $pin_lat . ', ' . $pin_long . '],13);
L.tileLayer(\'https://cartodb-basemaps-{s}.global.ssl.fastly.net/light_all/{z}/{x}/{y}{r}.png\',{maxZoom: 18,attribution: \'\'}).addTo(mymap);
var markerz = L.marker([' . $pin_lat . ', ' . $pin_long . '],{draggable:
true}).addTo(mymap);
var searchControl   =   new L.Control.Search({url:
\'//nominatim.openstreetmap.org/search?format=json&q={s}\',jsonpParam:
\'json_callback\',
propertyName: \'display_name\',propertyLoc:
[\'lat\',\'lon\'],marker: markerz,autoCollapse: true,autoType:
true,minLength: 2,});
searchControl.on(\'search:locationfound\', function(obj) {      
    var lt  =   obj.latlng + \'\';
    var res = lt.split("LatLng(" );
    res = res[1].split( ")" );
    res = res[0].split( ","
);
document.getElementById(\'map_lat\').value = res[0];
document.getElementById(\'map_long\').value = res[1];
});

mymap.addControl( searchControl );
markerz.on(\'dragend\', function (e) {
        document.getElementById(\'map_lat\').value =
        markerz.getLatLng().lat;
        document.getElementById(\'map_long\').value =
        markerz.getLatLng().lng;
});
L.control.locate({
strings: {
    title: "Show me where I am!"
}
}).addTo(map);map.on(\'locationfound\',(e)=>{
console.log(e);
document.getElementById(\'map_lat\').value = e.latlng.lat;
document.getElementById(\'map_long\').value = e.latlng.lng;
});
</script>

Answer 1

您需要在标记上调用 setLatLng()：

map.on(\'locationfound\',(e)=>{
    console.log(e);
    markerz.setLatLng(e.latlng);
    document.getElementById(\'map_lat\').value = e.latlng.lat;
    document.getElementById(\'map_long\').value = e.latlng.lng;
});

如何构建带有可拖动标记的 Leaflet 控件（拖动时更新 lat/long）和 lat/long 形式的自动更新值

How to build Leaflet control located with marker draggable(update lat/long when drag) & auto update value in lat/long form

javascript

php

wordpress

leaflet