filtering pd.DataFrame with dash dropdown

Question

I'm new to Dash and trying to filter the the following dataframe with a dropdown and show the filter dataframe. I am not able to define the callback function properly. Any sample code is really appreciated,

df = pd.DataFrame({
    'col1': ['A', 'B', 'B', 'A', 'B', 'A'],
    'col2': [2, 1, 9, 8, 7, 4],
    'col3': [0, 1, 9, 4, 2, 3],   
})

coralvanda · Accepted Answer · 2020-09-20 22:34:56Z

4

Here is the page from the docs that I think might be a good place to start. If you know the dataframe ahead of time, then you can populate the dropdown with the values that you know you'll need. If you don't, then you would need to use a callback to update the dropdown options prop.

The first example on that docs page shows how to get the value from a dropdown, and output it. In your case, you'd use the dropdown to filter the dataframe perhaps like:

@app.callback(
    Output('data-table-id', 'data'),
    [Input('dropdown-id', 'value')
)
def callback_func(dropdown_value):
    df_filtered = df[df['col1'].eq(dropdown_value)]

    return df_filtered.to_dict(orient='records)

And then you would set the output of the callback to the data prop of a Dash datatable. I've added some made-up values for the Output and Input part of the dropdown, hopefully that gives the general idea.

answered Sep 20, 2020 at 22:34

coralvanda

6,6562 gold badges17 silver badges25 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Phoenix Over a year ago

Thanks, but in the layout, how should I use this output? A simple html.Div(id='data-table-id', ???), doesn't work ...

coralvanda Over a year ago

Right. You should use a data table component.

Collectives™ on Stack Overflow

filtering pd.DataFrame with dash dropdown

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related