Hi,
I have a slider and 2 graphs. When I move the slider, it calls a callback and updates one graph. I also want it to update the second graph. In the callback, when I move the slider it recalculates the first graph in the function. In same function, I’m calling to recalculate the data for the second graph. But I dont understand how to pass the new data to the second graph.
Callback from first graph
def update_figure(data1, data2):
new_data_for_graph_1 = my_module(data1, data2) # data for graph 1
new_data_for_graph_2(new_data_for_graph_1 ) # data for graph 2
fig1 = px.scatter(new_data_for_graph_1, x, y) # update graph 1
return fig1
Second graph below
def func_to_calc_graph_2_data():
....
....
return node_trace, edge_trace, G
#### Start Dash #####
# figure to create plot
fig = go.Figure(data=[edge_trace, node_trace],
layout=go.Layout(
title='<br>Network Graph of '+str(num_nodes)+' rules',
titlefont=dict(size=16),
showlegend=False,
hovermode='closest',
margin=dict(b=20,l=5,r=5,t=40),
annotations=[ dict(
showarrow=False,
xref="paper", yref="paper",
x=0.005, y=-0.002 ) ],
xaxis=dict(showgrid=False, zeroline=False, showticklabels=False),
yaxis=dict(showgrid=False, zeroline=False, showticklabels=False)))
# Div layout
html.Div([
html.Div(dcc.Graph(
id='node_graph',
figure=fig,
style={'width': '39%', 'display': 'inline-block'}
)),
html.Div(className='row', children=[
html.Div([html.H2('Overall Data'),
html.P('Num of nodes: ' + str(len(G.nodes))),
html.P('Num of edges: ' + str(len(G.edges)))],
className='three columns'),
html.Div([
html.H2('Selected Data'),
html.Div(id='selected-data'),
], className='six columns')
])
])
@app.callback(
Output('selected-data', 'children'),
[Input('node_graph','selectedData')])
def display_selected_data(selectedData):
num_of_nodes = len(selectedData['points'])
text = [html.P('Num of nodes selected: '+str(num_of_nodes))]
for x in selectedData['points']:
# print(x['text'])
material = x['text'].split('<br>')[0][7:]
text.append(html.P(str(material)))
return text