How to plot when we have dropdown menu with multiple selections?

Hello, I am pretty new to dash plotly. I am trying to create a dropdown menu with multiple selections ON. I have a dataframe with the column names [‘col1’, ‘col2’, ‘col3’, ‘col4’, ‘col5’]. I want to plot this dataframe to have ‘col5’ in the y-axis, and the rest of the columns in the dropdown menu for the x-axis selection. I want to add any of these columns to my x-axis as I selected them from the dropdown menu.
I cannot understand what I need to modify to make it work. I checked the published posts here but I couldn’t figure it out.
I get “Callback error updating mygraph1.figure” when I run my code below:

import dash_bootstrap_components as dbc
import pandas as pd
import plotly.express as px
from dash.exceptions import PreventUpdate

df = pd.read_csv('test.csv')

app = Dash(external_stylesheets=[dbc.themes.SUPERHERO])

app.layout = dbc.Container([
    dbc.Row([
        dbc.Col([
            dcc.Dropdown(id='mydd1',
                         options=df.columns.values[0:4],
                         multi= True,
                         clearable=True,
                         value=[])
        ], width=4),
    ]),

    dbc.Row([
        dbc.Col([
            dcc.Graph(id='mygraph1', figure={})
        ], width=4),
    ])

], fluid=True)

@app.callback(
    Output('mygraph1', 'figure'),
    Input('mydd1', 'value'),
)

def update_title(X):
    if X is None:
        raise PreventUpdate

    fig1 = px.line(df, x=df[X], y=df['col5'])
    return fig1


if __name__ == "__main__":
    app.run_server(debug = True, port=8055)```

Hi @Peyman,

Welcome to the forums.

Your code is fine, just one small bug:

change from
fig1 = px.line(df, x=df[X], y=df['col5'])

to
fig1 = px.line(df, x=X, y='col5')

Since you are specifying the df in the beginning, x and y are actually the column names.

2 Likes

Thank you, that worked perfectly.