I am trying to use the following code to render a map, and it disappears upon rendering.
import wget
import pandas as pd
import streamlit as st
import folium
from streamlit_folium import st_folium
from folium.plugins import HeatMap
link_to_data = 'https://raw.githubusercontent.com/dvrob92/SIT720/master/housing_dataset.csv'
df = pd.read_csv(wget.download(link_to_data))
df = df[['housing_age', 'total_rooms', 'total_bedrooms', 'population', 'average_income', 'ocean_proximity', 'house_value', 'latitude', 'longitude']]
st.title("Housing Data Map Viewer")
st.sidebar.header("Filters")
filters = {
'housing_age': st.sidebar.slider("Housing Age", int(df['housing_age'].min()), int(df['housing_age'].max()), (int(df['housing_age'].min()), int(df['housing_age'].max()))),
'total_rooms': st.sidebar.slider("Total Rooms", int(df['total_rooms'].min()), int(df['total_rooms'].max()), (int(df['total_rooms'].min()), int(df['total_rooms'].max()))),
'total_bedrooms': st.sidebar.slider("Total Bedrooms", int(df['total_bedrooms'].min()), int(df['total_bedrooms'].max()), (int(df['total_bedrooms'].min()), int(df['total_bedrooms'].max()))),
'population': st.sidebar.slider("Population", int(df['population'].min()), int(df['population'].max()), (int(df['population'].min()), int(df['population'].max()))),
'average_income': st.sidebar.slider("Average Income", float(df['average_income'].min()), float(df['average_income'].max()), (float(df['average_income'].min()), float(df['average_income'].max()))),
'ocean_proximity': st.sidebar.multiselect("Ocean Proximity", options=df['ocean_proximity'].unique(), default=df['ocean_proximity'].unique()),
}
if st.sidebar.button("Update Map"):
filtered_df = df.copy()
filtered_df = filtered_df[(filtered_df['housing_age'] >= filters['housing_age'][0]) & (filtered_df['housing_age'] <= filters['housing_age'][1])]
filtered_df = filtered_df[(filtered_df['total_rooms'] >= filters['total_rooms'][0]) & (filtered_df['total_rooms'] <= filters['total_rooms'][1])]
filtered_df = filtered_df[(filtered_df['total_bedrooms'] >= filters['total_bedrooms'][0]) & (filtered_df['total_bedrooms'] <= filters['total_bedrooms'][1])]
filtered_df = filtered_df[(filtered_df['population'] >= filters['population'][0]) & (filtered_df['population'] <= filters['population'][1])]
filtered_df = filtered_df[(filtered_df['average_income'] >= filters['average_income'][0]) & (filtered_df['average_income'] <= filters['average_income'][1])]
filtered_df = filtered_df[filtered_df['ocean_proximity'].isin(filters['ocean_proximity'])]
if not filtered_df.empty:
m = folium.Map(location=[filtered_df['latitude'].mean(), filtered_df['longitude'].mean()], zoom_start=6)
marker_layer = folium.FeatureGroup(name="Markers")
for _, row in filtered_df.iterrows():
folium.CircleMarker(
location=(row['latitude'], row['longitude']),
radius=3,
popup=f"Housing Age: {row['housing_age']}<br>Total Rooms: {row['total_rooms']}<br>Total Bedrooms: {row['total_bedrooms']}<br>Population: {row['population']}<br>Average Income: {row['average_income']}<br>House Value: {row['house_value']}<br>Ocean Proximity: {row['ocean_proximity']}",
color='blue',
fill=True,
fill_opacity=0.7
).add_to(marker_layer)
marker_layer.add_to(m)
heat_data = [[row['latitude'], row['longitude']] for _, row in filtered_df.iterrows()]
if heat_data:
heat_layer = HeatMap(heat_data, name="Heatmap")
heat_layer.add_to(m)
# Add layer control to toggle between marker and heatmap layers
folium.LayerControl().add_to(m)
# Display the map
st_folium(m, width=700)
else:
st.write("No data found for the selected filters.")
Using my own dataset, I actually got it to be stable (even though the map re-renders every time I move it), but when I added heatmap to the code, it disappears immediately upon rendering again.
(Note: I am using housing market dataset in my example for reproducibility. My dataset has lat/lon and some other cols I am filtering on.)