Colliding/overlapping tooltips with {permanent: true}

• I’m reporting a bug, not asking for help (more a feature request than a bug)
• I’ve looked at the documentation to make sure the behaviour is documented and expected
• I’m sure this is a Leaflet code issue, not an issue with my own code nor with the framework I’m using (Cordova, Ionic, Angular, React…)
• I’ve searched through the issues to make sure it’s not yet reported

---

How to reproduce

• Leaflet version I’m using: 1.0.0

• Browser (with version) I’m using: Chrome 54.0.2840.99 m

• OS/Platform (with version) I’m using: Win7 x64

• add a point layer with high point density

• enable tooltips

• use tooltip option permanent: true

What behaviour I’m expecting and which behaviour I’m seeing

• I would hope for (not expect) an option to prevent overlapping tooltips
• I see overlapping tooltips

Minimal example reproducing the issue

http://playground-leaflet.rhcloud.com/zohe/edit?html,output

• this example is as simple as possible
• this example does not rely on any third party code

A plugin existed to hide colliding features, and an issue was raised in the Leaflet.Label repo to adapt for pre-Leaflet1.0.0 labels, but I don’t believe it was implemented:

https://github.com/Leaflet/Leaflet.label/issues/128 https://github.com/MazeMap/Leaflet.LayerGroup.Collision/issues/1

Any plans to implement something for the new Leaflet1 tooltips?

[perliedman]

While I agree this would be nice, I think handling label collision is too complex to fit in Leaflet’s core.

I would suggest you look into this plugin, which sounds like it could be useful in your use case: https://github.com/yakitoritabetai/Leaflet.LabelTextCollision

[tomchadwin]

@Shadowman4205 No, I’ve not implemented any solution to this myself. However, you should take a look at @JamesMilnerUK’s Labelgun:

https://github.com/Geovation/labelgun

I believe that’s a perfect solution to the issue, but I’ve not understood it well enough yet to implement it.