[英]Update position marker on Leaflet map on double click
我将这段代码添加到由JSON文件生成的Leaflet映射标记中
jQuery().ready(function (){
$.getJSON(
'/EUREKA/json/map_container/json_map_container.php',
function(data){
for ( var i=0; i < data.length; ++i )
{
k=i;
var myIcon = L.icon({
iconUrl: 'maps/images/' + data[i].type + '.png',
iconRetinaUrl: 'maps/images/' + data[i].type + '.png',
iconSize: [42, 55],
iconAnchor: [9, 21],
popupAnchor: [0, -14]
});
markerArray[i] = L.marker( [data[i].latitude, data[i].longitude], {id: data[i].id, icon: myIcon, draggable:'true'} )
.bindPopup( '<div>' + '<b>PDL di riferimento:</b> ' + data[i].codice + '<br/>'
+ '<b>Riferimento appaltatore:</b> '
+ data[i].companyId + '<br/>'
+ '<b>Tipo contenitore:</b> '
+ data[i].type + '<br/>'
+ '<b>Numero RDP:</b> '
+ data[i].rdpNumber + '<br/>'
+ '<b>Preposto di riferimento:</b> '
+ data[i].preposto + '<br/>'
+ '<b>Descrizione del rifiuto:</b> '
+ data[i].description
+ '</div>',
{direction: 'left'} )
.addTo( map );
//markerArray[i] = marker1;
markerArray[i].on('dblclick', function(e){
console.log("ID Marker Array: " + markerArray[k].options.id);
var latitudeMarker = markerArray[k].getLatLng().lat;
var longitudeMarker = markerArray[k].getLatLng().lng;
$.getJSON(
'/EUREKA/json/map_container/json_update_position.php?&lat=' + latitudeMarker + '&lng=' + longitudeMarker + '&id=' + markerArray[k].options.id,
function(data){
console.log("Posizione aggiornata")
});
});
}
});
JSON'json_map_container.php'文件从SQL查询返回的日期。 我想在doubleclick事件中将标记拖动到新位置时更新标记在地图中的位置,我想使用新的标记位置和ID调用JSON'json_update_position.php',然后JSON执行UPDATE查询在我的数据库上,但是当我双击标记时,我已经生成了最后一个ID。 谁能帮我?
阅读有关JavaScript中的闭包的信息 ,并查看这个很好的答案中的示例5,它描述了您的问题:基本上,在回调中读取k
时, k
始终是最后设置的值。
您可以应用此答案中解释的内容,或获取e.target
传递给回调的事件对象中标记的引用:
markerArray[i].on('dblclick', function(e){
var marker = e.target;
console.log("ID Marker Array: " + marker.options.id);
var latitudeMarker = marker.getLatLng().lat;
var longitudeMarker = marker.getLatLng().lng;
$.getJSON(
'/EUREKA/json/map_container/json_update_position.php?&lat=' + latitudeMarker + '&lng=' + longitudeMarker + '&id=' + marker.options.id,
function(data){
console.log("Posizione aggiornata")
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.