Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Leaflet marker is not draggable even if draggable=true

I'm using a Leaflet map with markers.

When the user clicks "edit" on my page, I want to make the markers draggable. If I set the property draggable to true for each marker, it doesn't work.

When I create a new marker and set the property right from the beginning, it works.

like image 536
ada91 Avatar asked Apr 08 '13 20:04

ada91


2 Answers

You gotta do it like this:

marker.dragging.disable(); // marker.dragging.enable();

My first attempt only changes a technical property but not the behavior.

like image 62
ada91 Avatar answered Nov 16 '22 18:11

ada91


Motivated by @mc0e problem concerning 'undefined'. Here is an example.

(Based on the code from Leafletjs.com and Leafletjs quick start)

  1. Open Wikimedia maps (which is based on the framework in question).
  2. Open browser console (Ctrl+j or Ctrl+k) to put a Marker (you will need to define a variable first). Use Code-1.

Code-1 in console:

var markerLondon = L.marker()
    .setLatLng([51.5, -0.09])
    .bindPopup('Centre of London')
    .addTo(map)
    .openPopup();
  1. Now you have a non-draggable marker. Use Code-2 to make the Marker draggable.

Code-2 in console:

markerLondon.dragging.enable();

Further reading: Marker API reference.

PS: Once Wikimedia starts using something else, you may test it with BigMap 2 (also based on the same framework) created for making static OpenStreetMap images.

like image 37
ZolVas Avatar answered Nov 16 '22 20:11

ZolVas