使用回调使用三个下拉菜单更新图表-Dash

时间:2019-06-06 16:06:02

标签: plotly-dash

我有三个下拉菜单。第二个取决于第一个,第三个取决于第一个和第二个。下拉菜单后有一个“提交”按钮,单击后,预期的行为是更新图表。但是,我的代码将永远更新,最终无法加载组件。下面是一个伪代码:

import dash
from dash.dependencies import Input, Output, State
import dash_html_components as html
import dash_core_components as dcc
from plotly import graph_objs as go
from plotly.graph_objs import *
import pandas as pd
import requests
import urllib3

#a dict converted into a df
dfDropDown = pd.DataFrame(output)
Topics = dfDropDown.Cat.unique()
app = dash.Dash()

app.layout = html.Div([

    html.Label('Drop-Downs'),
    dcc.Dropdown(
                                id = 'Criteria1',
                                options=[
                                   {'label':name, 'value':name} for name in Topics

                                ],
                                 value = list(Topics)[0]#
                        ),
    html.Div([
        dcc.Dropdown(
            id='opt-dropdown'#to be updated based on the selection of first DropDown
            ),
            ]
        ),
                                 html.Div([
        dcc.Dropdown(
            id='opt-dropdown1'#to be updated based on the selection of first and second DropDown
            ),
            ]
        ),

    html.Button('Click Me',id='button-2'), #update the chart below, based on the values from the drop down
    html.Div(dcc.Graph(id='bar_plot'))

    #html.Div(id='output')
])


@app.callback(
    dash.dependencies.Output('opt-dropdown', 'options'),
    [dash.dependencies.Input('Criteria1', 'value')]
)
def update_date_dropdown(name):
    dropDownCategory = []
    dfCategory = dfDropDown.loc[dfDropDown['Topic'] == name]
    dropDownCategory = dfCategory.Category.unique()
    return [ {'label':name, 'value':name} for name in dropDownCategory]            


@app.callback(
    dash.dependencies.Output('opt-dropdown1', 'options'),
    [dash.dependencies.Input('Criteria1', 'value'),
     dash.dependencies.Input('opt-dropdown', 'value')]
)
def update_date_dropdown1(name,level1):
    dropDownCatValue = []
    dfCategoryValue =  dfDropDown.loc[dfDropDown['Topic'] == name]
    dfCategoryValue =  dfDropDown.loc[dfDropDown['Category'] == level1]     
    dropDownCatValue = dfCategoryValue.CategoryValue.unique()
    dropDownCatValue = [i for i in dropDownCatValue if i]
    return [{'label': name, 'value':name} for name in dropDownCatValue]

@app.callback(
    Output('bar_plot', 'figure'),
    [Input('button-2', 'n_clicks')],
    state=[State('Criteria1', 'value'),
           State('opt-dropdown', 'value'),
           State('opt-dropdown1', 'value')
    ]
     )

def computeGr(n_clicks, input1,input2,input3):
    #code to get the datapoints from an API based on the selected values and return the figure - this code run for a long time and errors out. 
    return {
              'data':traces,
                               'layout':go.Layout(barmode='stack',hovermode='closest')
                               #style={'width':600}
           }


if __name__ == '__main__':
    app.run_server(debug=True)```

0 个答案:

没有答案