I have created a ButtonGroup of 3 buttons. Each button describes a year and when clicked should change graph according to year. But when clicking the buttons, only one Graph(2020) year is displaying for all the three buttons(2018, 2019, 2020). And the ('Network Graph by Dash ') comes without including in the code
dbc.FormGroup([
dbc.Label(‘NETWORK GRAPH’,
style={‘textAlign’:‘center’}),
html.Div([
dbc.ButtonGroup(children=[
dbc.Button(‘2018’,color=‘primary’,outline=True),
dbc.Button(‘2019’,color=‘primary’,outline=True),
dbc.Button(‘2020’,color=‘primary’,outline=True)],
id=‘Butt1’),]),
dcc.Graph(id=‘Graph1’),
]) ,
@app.callback(
Output(‘Graph1’,‘figure’),
[Input(‘Butt1’,‘value’),],)
def Graph1(yrr):
Rest of the Code goes here
Hi @teja_m19
I think it’s because you’re using dbc.ButtonGroup(…). I don’t think the Dash callback decorator can recognize the component id Butt1 inside the Input(), because that id belongs to dbc.button() inside dbc.ButtonGroup().
I’m not familiar with Dash Bootstrap, so I’m not sure how to solve this. But I think that is where the problem lies.
Adam
Thanks Man . I hope it works
Need to assign ids to the buttons, not the button group. The callback has no idea what button you pushed.
Hi @adamschroeder
I have created the same graph using Dash without Bootstrap . Here xyx is the key factor to change the Graphs . But It says UnboundLocal Error. Here (btn11,btn12,btn13) are Buttons (2018,2019,2020). And when pressed should change accordingly. But it displays the ’ else ’ case Graph(xyx=36) for all .
Here is the code :
@app.callback(
Output(‘G1’,‘figure’),
[Input(‘btn11’,‘n_clicks’),
Input(‘btn12’,‘n_clicks’),
Input(‘btn13’,‘n_clicks’)]
)
def update_G1(but11,butt12,butt13):
path=‘C://Users//ilike//Desktop//P.xlsx’
wb=xl.load_workbook(path)
sh=wb.active
countr=[]
values=[]
countr.append('China')
values.append('')
changed_id = [p['prop_id'] for p in dash.callback_context.triggered][0]
if 'but11' in changed_id:
xyx=34
elif 'butt12' in changed_id:
xyx=35
elif 'butt13' in changed_id:
xyx=36
Hi @teja_m19
I’m assuming it’s because you’re trying to use xyz to build your network graph before it has been referenced above. It probably means that xyz has not been captured by your if or elif statements for some reason. So it doesn’t exist before you use it to create the graph. Maybe you can do something like:
if not but11: raise PreventUpdate
Or
if not but12: raise PreventUpdate
Maybe on initial load, your butt11, butt12 and 13 are not present in change_id…
Try to print(change_id) right after change_id=… but before the if statements. See what you get.
Still unresolved . I’ve chosen dash so that I dont have to worry about JavaScript etc. And can you help me . I can upload files in Google Drive and can you go through about the issue. I’m finding it hard to resolve 
your code still doesn’t know what xyz is. I’m not sure I understand what xyz is. It’s also not clear you are actually returning anything.
Assuming xyz is something about the figure… I would set it up like this:
Output(‘G1’,‘figure’)
[Input( … all the buttons… )]
[State(‘G1’,‘figure’)
def(btn1,btn2,btn3,fig):
That fig is a json object that you can peruse to update what you need to update. once that json object has been update, return fig and it should work
The two buttons were not working actually . So I did this and now they work fine . . .
Anyway Thanks for the help 
@app.callback(
Output(‘G1’,‘figure’),
[Input(‘btn11’,‘n_clicks’),
Input(‘btn12’,‘n_clicks’),
Input(‘btn13’,‘n_clicks’)]
)
def update_G1(but11,butt12,butt13):
changed_id = [p['prop_id'] for p in dash.callback_context.triggered][0]
if changed_id=='btn11.n_clicks':
xyx=34
elif changed_id=='btn12.n_clicks':
xyx=35
else:
xyx=36
Hey @adamschroeder
My bar graph show the yaxis values in billions. Some bars in the graph have minimum value(Millions). Due to this they are not been displayed clearly. How to change those Yaxis ticklabels to Millions . . .
If you’re using plotly Graph Object, you should be able to set yaxis range from, let’s say, zero to 10M
documentation here.
fig.update_layout(yaxis={range:[0,10000000]})
If you’re using plotly express, you can do this.
documentation here.
fig=px.bar(range_y=[0,10000000])
1 Like
