How do I add multi select to my folium map?

Hi all.

I successfully deployed an app and I am really enjoying Streamlit. Currently, my code below shows a folium map of cooks in a location by an icon and allows you to select the mile radius you would like to display around all of the cooks.

I would like to add a multi select box, which allows you to pick which cooks are on the map. However I cannot for the life of me figure out how to incorporate st.multiselect!

dicts = {"1 mile":1609,
         "2 miles": 3218,
         "3 miles": 4828}

add_select = st.sidebar.selectbox("What radius do you want to assign?",
                                  ("1 mile", "2 miles","3 miles"))

def show_maps(data, df):
    lat= 51.64270
    lon = -0.20747
    map_fs1 = folium.Map(location=[lat, lon], zoom_start=11.2)
    
    df.apply(lambda row:folium.Circle(location=[row["longitude"], row["latitude"]], 
                                              radius = dicts[add_select],color = 'darkgreen', fill = True,
                                      fill_opacity = 0.2,Popup=row['cook'])
                                             .add_to(map_fs1), axis=1)
    
    df.apply(lambda row: folium.Marker(location=[row["longitude"], row["latitude"]],popup=row['cook'],
    icon=folium.Icon(color='red', icon='cutlery', prefix = 'fa'),).add_to(map_fs1), axis = 1)
    
    folium_static(map_fs1)

show_maps(add_select, chefs)

I would like my multiselect to reference the column in my dataframe, ‘cooks’. Can someone kindly point me in the direction to a guide perhaps?

Thanks a lot.

Hi @jimchoo91 -

st.multiselect takes “list-like” inputs, and returns a list of the chosen options. So if you want to pass an entire column worth of choices, you could do something like:

selections = st.multiselect("Choose your values", df.column.unique())

In terms of doing whatever with the values, you could loop over the selections list:

for s in selections:
    map.some_function(s)

folium_static(map)

Best,
Randy

Thanks very much for that Randy, however I am unsure why I cannot present only the selected cooks on my map - instead it shows everyone as it previously did:

dicts = {"1 mile":1609,
         "2 miles": 3218,
         "3 miles": 4828}

add_select = st.sidebar.selectbox("What radius do you want to assign?",
                                  ("1 mile", "2 miles","3 miles"))

chefs1 = st.multiselect('Which chefs do you want to view?', chefs.cook.unique())

def show_maps(data, df):
    lat= 51.64270
    lon = -0.20747
    map_fs1 = folium.Map(location=[lat, lon], zoom_start=11.2)
    
    for i in chefs1:
        df.apply(lambda row:folium.Circle(location=[row["longitude"], row["latitude"]], 
                                              radius = dicts[add_select],color = 'darkgreen', fill = True,
                                      fill_opacity = 0.2,Popup=row['cook'])
                                             .add_to(map_fs1), axis=1)
        df.apply(lambda row: folium.Marker(location=[row["longitude"], row["latitude"]],popup=row['cook'],
    icon=folium.Icon(color='red', icon='cutlery', prefix = 'fa'),).add_to(map_fs1), axis = 1)  
          
    folium_static(map_fs1)

show_maps(add_select, chefs)

I took your suggestion of looping over the selections list to apply my map.

Fixed it! thanks

1 Like