randyzwitch / streamlit-folium

Streamlit Component for rendering Folium maps
https://folium.streamlit.app/
MIT License
476 stars 178 forks source link

Streamlit-folium is extending its container way further past the bottom border of the map #213

Open espogian opened 1 month ago

espogian commented 1 month ago

The current version of streamlit-folium (0.22.1) has introduced a bug which is clearly visible from the showcase page (https://folium.streamlit.app/). Right on the bottom of the map, there is a huge blank space which extends a lot until the next element or the footer/bottom of the page.

randyzwitch commented 1 month ago

Are you seeing this locally @espogian? I'm not sure the app was actually rebuilt with 0.22.1, but I do see this error:

────────────────────────────────────────────────────────────────────────────────

AttributeError: module 'streamlit' has no attribute 'experimental_rerun'

────────────────────── Traceback (most recent call last) ───────────────────────

  /home/adminuser/venv/lib/python3.8/site-packages/streamlit/runtime/scriptrun  

  ner/exec_code.py:85 in exec_func_with_error_handling                          

  /home/adminuser/venv/lib/python3.8/site-packages/streamlit/runtime/scriptrun  

  ner/script_runner.py:576 in code_to_exec                                      

  /mount/src/streamlit-folium/examples/pages/dynamic_updates.py:182 in          

  <module>                                                                      

    179                                                                         

    180                                                                         

    181 if __name__ == "__main__":                                              

  ❱ 182 │   main()                                                              

    183                                                                         

  /mount/src/streamlit-folium/examples/pages/dynamic_updates.py:108 in main     

    105 │   │   st.session_state["last_object_clicked"] = out["last_object_cli  

    106 │   │   state = get_state_from_lat_lon(*out["last_object_clicked"].val  

    107 │   │   st.session_state["selected_state"] = state                      

  ❱ 108 │   │   st.experimental_rerun()                                         

    109 │                                                                       

    110 │   st.write("## Dynamic feature group updates")                        

    111                                                                         

────────────────────────────────────────────────────────────────────────────────

AttributeError: module 'streamlit' has no attribute 'experimental_rerun'
espogian commented 1 month ago

I can see the exact same problem (the issue of the blank space after the map, which I described in my first post) present on the published version of https://folium.streamlit.app/ in my apps which are using streamlit-folium (0.22.1). However, the error you are posting is not present in my apps, therefore I think is not related. Thank you

randyzwitch commented 1 month ago

The issue you are seeing isn't present for me?

Screenshot 2024-09-17 at 9 55 32 AM
espogian commented 1 month ago

I can scroll way past the end of the map. Reproduced using Chrome Version 128.0.6613.138 (Official Build) (arm64) and Safari Version 18.0 (19619.1.26.111.10, 19619). With both of them I've tried to access the https://folium.streamlit.app/ clearing the cache.

image

randyzwitch commented 1 month ago

I can get that to happen, but it's intermittent. I've rebooted the app to ensure its on 0.22.1, and will fix the experimental_rerun error to see if this persists. If so, then we can try and figure out what else might be causing this

espogian commented 1 month ago

It's not "intermittent", it's happening the very first time you open the web page, after a refresh (or another interaction) the problem disappears.

randyzwitch commented 1 month ago

What is you want from me? I'm trying to figure out the issue and I'm telling you that on my computer it is intermittent. That's not up for debate, it's what I am seeing.

espogian commented 1 month ago

I did not want to sound rude, I'm sorry :) Just tought it could be helpful to better specify under which conditions the issue happens. Thank you!

randyzwitch commented 1 month ago

Thanks for clarifying :)

I now agree that it's not intermittent, it's literally every other refresh for me, irrespective of having/not having cache. Unfortunately, there are no messages in the console to indicate an error.

@hansthen I don't think this is an issue with the patch you just did for Draw, but I also don't know what to look for here. Any ideas?

randyzwitch commented 1 month ago

As it turns out, it's not the map but the code on the right side that is causing the issue. The map is only 700px tall, the right column is 2438px tall

Screenshot 2024-09-17 at 10 42 42 AM Screenshot 2024-09-17 at 10 42 30 AM

When it doesn't show the issue, the code column is only 833px tall

Screenshot 2024-09-17 at 10 44 55 AM
hansthen commented 1 month ago

@hansthen I don't think this is an issue with the patch you just did for Draw, but I also don't know what to look for here. Any ideas?

Just to be sure, I undid my changes for the Draw plugin on the latest main branch locally. Without my changes the demo app also shows this issue.

The same issue also shows up in the page for the draw plugin. There is a code block below the two columns, which makes it easier to see. The issue is still there even if there is nothing in the second column.

  with st.echo(code_location="below"):
      import folium
      import streamlit as st
      from folium.plugins import Draw

      from streamlit_folium import st_folium

      m = folium.Map(location=[39.949610, -75.150282], zoom_start=5)
      Draw(export=True).add_to(m)

      c1, c2 = st.columns(2)
      with c1:
          output = st_folium(m, width=700, height=500)

      with c2:
          pass
hansthen commented 1 month ago

I don't have time right now, but I would check the setComponentHeight message sent from the streamlit-folium component in a javascript debugger.