Streamlit-Folium Relative Width

randyzwitch has done an amazing job creating streamlit-folium. It has really come in handy! Just one question though. As I understand it, streamlit-folium basically generates HTML which is then displayed to the page. Therefore, you can’t set the width to fit a Streamlit container as folium is HTML layer and the container is Streamlit layer, correct?

So, for my use case, I want the map to just be set to 100% width of the page. And I want it to be dynamic (if possible) so that if the user makes the window smaller than the map will resize to fit. Is this possible? This should in theory just be CSS, yeah?

1 Like

Hey @MichaelSenescall, glad you’re finding the package useful!

Yes, this is a tough one…in general, our Components framework doesn’t have a good way to signal back to Python what the iframe size is. So for streamlit-folium, I opted to take whatever the values are from inside the Folium object, or alternatively, let the user specify directly. Unfortunately, there’s no way currently to set this in percentage terms.


Hi, thanks for your component, do we support set the color bar when we plot the heatmap with folium?
I tried the line and step solution, but I found when the import data changed, the color bar will not change.