Hi, I am doing a fun project and get stuck in this problem. If I do this
icao_flt_phs = ['Ground', 'Take-off', 'Climb', 'Cruise', 'Descent', 'Approach', 'Landing', 'Post Landing']
causes_dict = {
'Ground': ['High taxi speed - Straight', 'High taxi speed - turns'],
'Take-off': ['High Pitch Rate', 'High climb out speed'],
'Climb': ['Low energy state', 'Overspeed'],
'Cruise': ['Low energy state', 'Overspeed', 'Flight near or at Max. Rec ALT.'],
'Descent': ['Overspeed'],
'Approach': ['Overspeed (Configuration)', 'High energy state', 'Unstabilised approach'],
'Landing': ['High Vertical energy- Hard landing', 'Long float', 'High lateral energy'],
'Post Landing': ['High taxi speed', 'Single Engine High thrust setting']
}
app = dash.Dash()
app.layout = html.Div([
html.H1('Safety App'),
dcc.Tabs(
tabs=[{'label': p, 'value': p} for p in icao_flt_phs],
value='Landing',
id='phase-tabs'
),
html.Div([
html.Div(
dcc.RadioItems(id='cause-tabs'),
style={'width': '20%', 'float': 'left'}
),
html.Div(
html.Div(id='tab-output'),
style={'width': '80%', 'float': 'right'}
)
])
])
@app.callback(Output('cause-tabs', 'options'), [Input('phase-tabs', 'value')])
def set_cause_options(value):
causes = causes_dict[value]
tabs = [{'label': c, 'value': c} for c in causes]
return tabs
@app.callback(Output('cause-tabs', 'value'), [Input('phase-tabs', 'value')])
def set_cause_value(value):
causes = causes_dict[value]
value = causes[0]
return value
@app.callback(Output('tab-output', 'children'), [Input('cause-tabs', 'value')])
def display_content(value):
num = 0
for k, l in causes_dict.items():
found = [i for i, v in enumerate(l) if v == value]
if len(found) > 0:
num = found[0]
break
data = [
{
'x': [1995, 1996, 1997, 1998, 1999, 2000, 2001, 2002, 2003,
2004, 2005, 2006, 2007, 2008, 2009, 2010, 2011, 2012],
'y': [219, 146, 112, 127, 124, 180, 236, 207, 236, 263,
350, 430, 474, 526, 488, 537, 500, 439],
'name': 'Rest of world',
'marker': {
'color': 'rgb(55, 83, 109)'
},
'type': ['bar', 'scatter', 'box'][num]
},
{
'x': [1995, 1996, 1997, 1998, 1999, 2000, 2001, 2002, 2003,
2004, 2005, 2006, 2007, 2008, 2009, 2010, 2011, 2012],
'y': [16, 13, 10, 11, 28, 37, 43, 55, 56, 88, 105, 156, 270,
299, 340, 403, 549, 499],
'name': 'China',
'marker': {
'color': 'rgb(26, 118, 255)'
},
'type': ['bar', 'scatter', 'box'][num]
}
]
return html.Div([
dcc.Graph(
id='graph',
figure={
'data': data,
'layout': {
'margin': {
'l': 30,
'r': 0,
'b': 30,
't': 0
},
'legend': {'x': 0, 'y': 1}
}
}
)
])
then it works fine, but if I replace the RadioItems with Tabs i.e. dcc.RadioItems(id='cause-tabs')
and update tabs
instead of options
in the callback i.e. @app.callback(Output('cause-tabs', 'tabs'), [Input('phase-tabs', 'value')])
, I get Error loading dependencies.
Can somebody please help me? Thanks in advance.