How do you populate charts with data on clicking button in Dash with python?

@TaxpayersMoney wrote:

I am experimenting with Dash/Plotly. I can’t work out how to populate charts with data on the click of a button. I know that if I pass the same thing I am returning from my callbacks directly to the figure argument in the app layout the chart works. I know that I can get the callback to change the text of a heading. I hit the submit button and the chart doesn’t change. Here is my code:

app = dash.Dash(__name__, assets_external_path=assets)

app.layout = html.Div(children=[

    html.Div(className='parent', children=[

        html.Div(className='pD', children=[

           dcc.Dropdown(id='size', options=[
                {'label': 'Small', 'value': 'small'},
                {'label': 'Medium', 'value': 'medium'},
                {'label': 'Large', 'value': 'large'}
            ])

        ]),

        html.Div(className='submit', children=[

            html.Button('Submit', id='submit', n_clicks=0)

        ]),

        html.Div(className='graph_box cD', children=[dcc.Graph(id='graph')])

    ]),

])

@app.callback(
    Output('graph', 'figure'),
    [Input('submit', 'n_clicks')],
    [State('size', 'value')]
)
def update_chart(clicks, size):
    if clicks > 1:        
        return {'data': [{'x': np.random.randint(0, 100, 1000), 'type': 'histogram'}]}

app.run_server(debug=False, port=8000)

Posts: 1

Participants: 1

Read full topic