I have a scenario where I have 2 graphs that act as inputs into a 3rd graph, where the clickData from the 2 graphs act as inputs for the 3rd graph. I have it set so that when the clickData for either one of or both of the first 2 graphs is None, then that means there is no filter on that “category” (so None = All, basically). The issue I’m having is my desire to be able to reset the clickData value of either of these graphs back to None without having to hit the Undo button a bunch of times. I tried some work around where I was trying to dynamically create an html button when the clickData value isn’t None, and then have a callback when that button is pressed to regenerate the graph, but it doesn’t seem to work, it just causes the graph not to show up on the original page load.
For a basic example, lets say I have a pie chart and a div that outputs the value that is clicked, like so:
-- coding: utf-8 --
import dash
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output, State
import plotly.graph_objs as go
colors = {
‘background’: ‘white’,
‘text’: ‘#111111’,
}
app = dash.Dash()
app.layout =
html.Div([
html.Div([
dcc.Graph(
id=‘pie-graph’,
figure={
‘data’: [
go.Pie(
labels=[‘a’,‘b’,‘c’],
values=[60,25,15],
hoverinfo=‘label+percent’,
textinfo=‘percent’,
)
],
‘layout’: {
‘plot_bgcolor’: colors[‘background’],
‘paper_bgcolor’: colors[‘background’],
‘font’: {
‘color’: colors[‘text’]
},
}
},
),
]),
html.Div(id=‘click-output’,
children=[
]),
])
@app.callback(
Output(‘click-output’, ‘children’),
[Input(‘pie-graph’, ‘clickData’)])
def display_click_data(clickData):
print(clickData)
if clickData is None:
return ‘100’
else:
return clickData.get(‘points’)[0].get(‘value’)
if name == ‘main’:
app.run_server(debug=True)
How can I reset the clickData of the chart to without using the Undo button? The reason I want to avoid using it is so when I have to charts acting as clickData inputs, that I can avoid undoing the other chart when I just want to “reset” one of them.
Thanks!