Search bar inside a dash leaflet map

I would like to add a search bar in a dash leaflet map. To search for address for exemple. Is ther an example for that somewhere?

Hi,

I think you could use this approach (click the link @Emil provides):

Hi,
ok thanks i will look at it.

Hello,

Were you able to add a search bar to the dl map? I am working on a project now wherein I need to add the search bar into my dash leaflet map.

Thank you

Yeah, just create a div container with a map and search bar. Make the search bar with a style of {“display”: “none”} add an easy button into the dash leaflet with an id. Then create a callback with that easy button id as the input and the output should be the id of the search bars style. Use the callback to trigger the style of the search bar from “display”: "none to an absolute with a z-index greater than the map

Thank you! Looks like I would have to use the search bar with a geo-coding library to get what I want. Is there no other solution to type something in the search bar that’s built-in dash-leaflet, like the folium plugin for geocoder that can be used with folium maps?

You could build it within dash leaflet, I’m using geo-coding in my map. Click on the magnifying glass to see how my search works, type something out and click on one of the locations in the ag grid. Might be a good source of inspiration for you. Also works well if you open it on mobile:

https://dash.geomapindex.com/

Such a cool website, thank you!