Hello all,
I’m a bit new to All-In-One Components and I was trying to create a dash page where depending on the number of inputs from a dropdown with multi=True, it will create an AIO component with radio items and a graph for each selected value in the dropdown.
How do I get the radio item callbacks to trigger such that the graph will change within its respective AIO component?
Currently the only way a callback is triggering is if I use ALL instead of MATCH which would change all instances of this callback instead of just the one instance of the callback the radio button is being clicked in. (let me know if I am understanding this incorrectly)
super().__init__(children=[
dbc.Card([
dcc.Store(data=target,id=self.ids.target(aio_id)),
dcc.Markdown('''
> # '''target
, id=self.ids.markdown(aio_id)), #, **markdown_props
dcc.RadioItems([{'label':'2.0', 'value':2.0},
{'label':'5.0','value':5.0},
{'label':'8.0','value':8.0},],
id=self.ids.day_radio(aio_id), value=2.0,inline=True,inputStyle={'display':'inline-flex', 'margin-left':'7px'}),
dcc.Graph(id=self.ids.graph(aio_id),
# figure=go.Figure(),
figure=figures.make_simplified_target_lineplots(target,day'),
config={
'responsive': True,
'toImageButtonOptions': {
'format': 'png',
'height': 1000,
'width': 690,
'scale': 1
},
},
),
]),
], style={'display':'inline-flex'}
@callback(
output=Output(component_id=ids.graph(MATCH), component_property='figure'),
inputs=[Input(component_id=ids.day_radio(MATCH), component_property='value'), ],
state=State(ids.target(MATCH), 'data'),
)
def update_signature_plot(day, target):
return figures.make_simplified_target_lineplots(target, day)