pythonweb-applicationsdashboardstreamlitsocial-media

Streamlit multiselect filter using different dataframes


I have this code below that plot three columns from different dataframes. Now I add a Streamlit multiselect filter so that you can add or remove plots. The code is fine it is just that I want to add the the streamlit multiselect filter. See the code below:

socio_media = ['facebook','twitter','linkedin']
options = st.multiselect('Compare your social media platform', options = socio_media, 
                    default=socio_media)




fig = go.Figure()

fig.add_trace(go.Scatter(
    x=facebook_df['Date'],
    y=facebook_df['Impressions'],
    name='Facebook',
    mode='markers'
))

fig.add_trace(go.Scatter(
    x=twitter_df['Date'],
    y=twitter_df['Impressions'],
    name='Twitter',
    mode='markers'
))

fig.add_trace(go.Scatter(
    x=linkedin_df['Date'],
    y=linkedin_df['Impressions'],
    name='LinkedIn',
    mode='markers'
))

fig.update_layout(
    title= select+' '+'Over Time',
    xaxis=dict(title='Date'),
    yaxis=dict(title= select)
)
st.plotly_chart(fig, use_container_width=True)

Solution

  • All you need to do is put a conditional on each trace. For example:

    fig = go.Figure()
    
    if 'facebook' in options:
        fig.add_trace(go.Scatter(
            x=facebook_df['Date'],
            y=facebook_df['Impressions'],
            name='Facebook',
            mode='markers'
        ))
    
    # etc
    

    Abstractly, you put the pieces of code that add each trace inside a conditional for its respective selection:

    import streamlit as st
    
    socio_media = ['facebook','twitter','linkedin']
    options = st.multiselect('Compare your social media platform', options = socio_media, 
                        default=socio_media)
    
    if 'facebook' in options:
        st.write('Adding Facebook...')
        # Add trace
    
    if 'twitter' in options:
        st.write('Adding Twitter...')
        # Add trace
    
    if 'linkedin' in options:
        st.write('Adding LinkedIn...')
        # Add trace