I've discovered many annoyances with Leaflet.js related to rendering markers. They frequently cover each other, even when zoomed in fully, forcing me to balance the cursor with 1-pixel precision to get to the pop-up data (or access for clicking) the marker that is "behind" another marker. It seems to place itself 1 pixel apart to be "helpful", but this is not nearly enough.

Is there some way to get any markers that overlap to start "bending" to the side, so that they still point to the right position, but still are "out of the way" so you can actually easily click them (not to mention SPOT them!)?

I assume that this feature already exists, or something like it, because it's one of the first things I've noticed having dealt with maps for not very long.

1 Answer 1


You might want to look into the Leaflet.markercluster plugin.

At first the markers are grouped when they are close together and the separate markers are shown when you zoom in. If the maximum zoom level is reached the markers spread out (if they are still too close together) and it is possible to click on each marker. See the following picture for illustration:

picture with markers

  • I tried using it, but there were numerous glitches and bugs in their programming, resulting in stuff not working as it should and the breakage of my click events as well. I have too much experience with broken libraries to want to bother with this one more than I already have now. Sorry. It has to "just work" and not require me to research the bugs for weeks, which would doubtlessly have been the case if I were to start asking about the errors with that seemingly good thing.
    – J. Moe
    Commented Mar 4, 2018 at 1:32

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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