0

I have a map that has an onclick event fired and displays a marker where the user has clicked. Problem is that this event seems to overrun the double click event. Because of this, when I double click the map, the map puts a marker and doesn't zoom. Anyone has an idea how I can solve this?

openmap = L.mapbox.map('map', 'julievelghe.nmjoj53p',{doubleClickZoom: true}).setView([49.152969, 6.473007], 5);

//on map click, create a marker
openmap.on('click',function(event){
    var coordinates = event.latlng;
    placeMarker(coordinates);
    alert("Single click");
});
  • A workaround might be to set a global timer in the map click handler and if a second one happens within so many MS (e.g. 20ms or so) then handle it as a double click event. If not, handle as a single click event. You could also try to tie into the ondblclick dom event to see if you can do the zoom there. It just may turn into a manual process of zooming instead of automatic. – Branco Oct 13 '15 at 12:05
1

This is what's happening in your code:

  • First click lands on the map
  • Marker is created
  • Second click lands on the newly created marker

For a double-click to be triggered, the two individual click events must land in the same target. You can achieve this by making the marker non-interactive with the {interactive: false} option.

Keep in mind this behaviour is currently buggy in Leaflet 1.0.0-beta2, see https://github.com/Leaflet/Leaflet/pull/3937 - you might want to use custom CSS classes for your markers and use pointer-events: none in your CSS.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.