Using ClassName in callbacks

Dash Python
1

Hey guys, I am trying to format Div’s that I am using by using className =“six columns”. I am calling back two graphs from my input on the drop down menu. When I perform the callback, I get TypeError: ‘NoneType’ object is not callable.

app.layout(
html.Div([
html.Div([
html.Label(“Select Analysis”),
dcc.Dropdown(id = “dropdown”,
options =[
{‘label’:‘test’,‘value’:‘test’},
{‘label’:‘test2’,‘value’:‘test2’},
], value = “test”)
]),
html.Div([
dcc.Graph(id = ‘g1’),
],className = “six columns”),
html.Div([
dcc.Graph(id = ‘g2’)
],className = ‘six columns’)
])
)

@app.callback(
Output(component_id = ‘g1’, component_property = ‘children’),
[Input(component_id= ‘dropdown’,component_property = ‘value’)]
)

def update_g1(update):
fig = {}
fig = {‘data’: [{‘x’:[1,2,3],‘y’:[1,2,3],‘type’:‘bar’,‘name’: update}]}
return fig

@app.callback(
Output(component_id = ‘g2’, component_property = ‘children’),
[Input(component_id= ‘dropdown’,component_property = ‘value’)]
)

def update_g2(update):
fig = {}
fig = {‘data’: [{‘x’:[1,2,3],‘y’:[1,2,3],‘type’:‘bar’,‘name’: update}]}
return fig

2

Your callbacks should be targeting the figure property of the Graph components, rather than children.