leaflet.js - Đặt điểm đánh dấu khi nhấp chuột, cập nhật vị trí khi kéo

Question

cho một dự án nhỏ mà tôi đang thực hiện, tôi cần có thể đặt điểm đánh dấu trên bản đồ hình ảnh được hỗ trợ leaflet.js và cập nhật vị trí của điểm đánh dấu này , nếu nó bị kéo. Tôi sử dụng mã sau đây để thử điều này, nhưng nó không thành công. Tôi gặp lỗi 'điểm đánh dấu không được xác định'. Tôi không biết tại sao nó không hoạt động - có lẽ các bạn có thể giúp tôi không? ;)

function onMapClick(e) { 
    gib_uni(); 
    marker = new L.marker(e.latlng, {id:uni, icon:redIcon, draggable:'true'}; 
    map.addLayer(marker); 
}; 

marker.on('dragend', function(event){ 
    var marker = event.target; 
    var position = marker.getLatLng(); 
    alert(position); 
    marker.setLatLng([position],{id:uni,draggable:'true'}).bindPopup(position).update(); 
}); 

Answer 1

Trong đoạn mã trên, điểm đánh dấu không được xác định tại thời điểm xử lý sự kiện được thêm vào. Hãy thử những điều sau đây mà người nghe dragend được bổ sung ngay sau khi tạo ra các Marker:

function onMapClick(e) { 
    gib_uni(); 
    marker = new L.marker(e.latlng, {id:uni, icon:redIcon, draggable:'true'}); 
    marker.on('dragend', function(event){ 
      var marker = event.target; 
      var position = marker.getLatLng(); 
      console.log(position); 
      marker.setLatLng(position,{id:uni,draggable:'true'}).bindPopup(position).update(); 
    }); 
    map.addLayer(marker); 
}; 

Bạn cũng bị mất tích một khung vào cuối L.Marker mới của bạn() dòng.

Bạn cũng đặt position vào một mảng trong cuộc gọi tới setLatLng nhưng đã là đối tượng LatLng.