How to display the output of a reactive function (folium map) on a full panel width?

Panel
1

Hi, I have this code:

import folium
import panel as pn
pn.extension()

def get_map(lat=44, long=6, zoom_start=5):
    return folium.Map(location=[lat,long], zoom_start=zoom_start)

latitudes  = pn.widgets.IntSlider(name='Lat', value=44, start=35, end=70)
longitudes = pn.widgets.IntInput(name='Lon', value=6, step=1, start=-80, end=80)
reactive_maps = pn.bind(get_map, latitudes, longitudes)

widgets   =  pn.Column(latitudes, longitudes, width=200)
app = pn.Column("<br>\n## Test", pn.Row( widgets, reactive_maps),sizing_mode="stretch_width", min_height=600)

app

Which gives me this output:

image
image1858×1447 202 KB

I cannot find the way to display the map as full width of the notebook. Is there an easy solution for this?

I found a way to do it as a parametrized class but I would like to find a solution using a reactive function.

Thanks!

2

Just wrap the dynamic function in an explicit pn.panel and provide a sizing_mode:

reactive_maps = pn.panel(pn.bind(get_map, latitudes, longitudes), sizing_mode='stretch_both')
1 Like
3

Thank you very much! I missed the pn.panel function…

4

The pn.panel is just a helper that selects the appropriate Pane type for the object you are displaying. In this case it will take the function returned by pn.bind and return a ParamFunction pane to wrap it. The alternative would be to explicitly wrap the return value of your function, e.g.:

def get_map(lat=44, long=6, zoom_start=5):
    return pn.pane.plot.Folium(folium.Map(location=[lat,long], zoom_start=zoom_start), sizing_mode='stretch_both')
1 Like