Black Lives Matter. Please consider donating to Black Girls Code today.

Changing datatable on barchart click event

Hi, I am new to using plotly and dash and have made a site with django that shows a barchart and datatable side by side. I want to change the pandas dataframe which is the source of the datatable based on clicking a bar on the barchart.

I have currently got a bar chart that reads clicks from an example and gets the updated dataframe but I am not sure how to return the dataframe and update the table?

app = DjangoDash('SimpleExample')
df1 = get_spec_dataframe('security')
df_data = get_mostfrequent_data_all()
most_frequent_words = df_data[0][:30]
most_frequent_words_values = df_data[1][:30]
df = get_dataframe()

app.layout = html.Div([
    dcc.Graph(
        id='basic-interactions',
        figure={
            'data': [
                {
                    'x': most_frequent_words,
                    'y': most_frequent_words_values,
                    'name': 'Trace 1',
                    'mode': 'markers',
                    'type': 'bar'
                }  
            ],
            'layout': {
                'clickmode': 'event+select'
            }
        }
    ),

    html.Div(className='row', children=[
 
        html.Div([
            html.Pre(id='click-data'),
            dash_table.DataTable(id='table',columns=[{"name": i, "id": i} for i in df.columns],data=df.to_dict('records')),
            ], className='three columns'),
    ])
])

@app.callback(
    Output('click-data', 'children'),
    [Input('basic-interactions', 'clickData')])
def display_click_data(clickData):

    if clickData != None:
        label = str(clickData['points'][0]['x'])
    else:
        label = "security"
    df = get_spec_dataframe(label)
    return (df)