python-visualization / folium

Python Data. Leaflet.js Maps.
https://python-visualization.github.io/folium/
MIT License
6.94k stars 2.23k forks source link

TagFilterButton - Dropdown overlaps with Button #1867

Closed Merodas closed 6 months ago

Merodas commented 10 months ago

Describe the bug The Dropdown appearing when using TagFilterButton overlaps with the (then hidden) button itself. Using multiple Filters becomes challenging, as the text stays hidden behind the other filter buttons. image

The example page for folium shows this behavior: 
https://python-visualization.github.io/folium/latest/user_guide/plugins/tag_filter_button.html#
The example page for Leaflet does not:
https://maydemirx.github.io/leaflet-tag-filter-button/

Expected behavior Dropdown should open up next to the button, not overlapping it. By overlapping, using multiple TagFilterButtons is challenging.

Environment (please complete the following information):

Possible solutions Solution: Add margin between Button and Dropdown

folium is maintained by volunteers. Can you help making a fix for this issue? Sadly no, absolute beginner here.

Conengmo commented 9 months ago

Thanks for the issue report! Seems to be a big indeed, in the example of the Leaflet plugin it does work correctly.

I can’t directly spot what the issue is. I hope it’s something dumb like having the wrong import order for the css files in TagFilterButton: easybuttons should probably be loaded before tagfilterbutton css. But I’m on mobile so can’t check right now.