I am trying to create a graph controlled with a dropdown (which add traces on the graph) and with a rangeslider on the xaxis. When I generate the figure apart from the dash app it works. However, the traces of the different plots of the graph disappear when select different variables of the dropdown (multi dropdown).
code figure:
Blockquote
def figure(patient,variable):
f=df.query('patient=='+str(patient))[str(variable)]
colors = np.random.rand(20)
dff=df
steps = 1/6
ends = [0.16,0.33,0.50,0.67,0.84,1]
shapes = []
colors = ['red', 'orange','green','green','orange','red']*len(f)
for i, e in enumerate(ends):
shapes.append(dict(type="rect",
xref="paper",
yref="paper",
x0=0,
y0=e-steps,
x1=1,
y1=e,
fillcolor=colors[i],
opacity=0.5,
layer="below",
line_width=0,
)
)
layout = go.Layout(
title=str(variable),
plot_bgcolor='#FFFFFF',
barmode="group")
fig=go.Figure(layout=layout)
fig.add_trace(go.Scatter( x= np.array(list(range(0, np.shape(f)[0]))), y=f,
mode='markers +lines',
fillcolor= '#FFA500',
marker = dict(size=9, color=list(map(SetColor, f))),
line=dict(color='#FFFFFF', width=6)))
fig.update_layout(title_text="Heart rate",xaxis=dict(showgrid=False), shapes=shapes,dragmode='pan',clickmode='select',hovermode="x unified",
hoverlabel=dict(bgcolor='#00FFFF', bordercolor='#00FFFF'), transition=dict(duration=100))
return fig
Code Dash:
dbc.Tab(tab_id="tab_3", label="Tab 3", children=[
dbc.Container([
dbc.Card([dbc.CardHeader([html.H4("Patient 2")]),
dbc.CardBody([html.P("Patient 2"),dcc.Dropdown(id='drop_menu',
options=[{'label':'heart rate', 'value':'heart rate'},
{'label':'respiratory rate','value':'respiratory rate'},
{'label':'temperature','value':'temperature'},
{'label':'oxygen saturation','value':'oxygen saturation'},
{'label': 'systolic blood pressure','value': 'systolic blood pressure' },
{'label': 'diastolic blood pressure', 'value':'diastolic blood pressure'},
{'label': 'score','value':'score'}
], className= 'mb-2', multi=True
), dcc.Graph(id='graph2')])], style={'backgroundColor':'#FFA500', "height":"40rem"}, className= 'mb-2' )
], fluid=True) ])
@app.callback(
Output(“graph2”,“figure”),
[Input(“drop_menu”, “value”)]
)
def graph(variables):
if variables is None:
raise dash.exceptions.PreventUpdate()
else:
return figure(2,variables)
