I have been following tutorials online.
I thought my code should work, but it doesn’t compile. I get this error: “slider” doesn’t have “value” as a property."
Can you help me understand what I am doing wrong? Code is below:
app.layout = html.Div(
#style={'backgroundColor': colors['background']},
children=[
html.H1('Dashboard for Visualisation',
style={
'textAlign': 'center',
'color': colors['text_black']
}),
html.Div([
dcc.Dropdown(
id='main_dropdown',
options=[
{'label':'PCA', 'value':'PCA'},
{'label':'t-SNE', 'value':'t-SNE'}
],
value='None', # Starting value
)],
style={'width': '28%',
'display': 'inline-block',
'textAlign': 'center'}
),
html.H3(id='action_header'),
html.Div(id='action'),
html.Div(id='sub_action'),
html.Div(id='output_graph'),
html.Div(id='slider')
])
@app.callback(
Output(component_id='action_header', component_property='children'),
[Input(component_id='main_dropdown', component_property='value')])
@app.callback(
Output(component_id='action', component_property='children'),
[Input(component_id='main_dropdown', component_property='value')])
@app.callback(
Output(component_id='sub_action', component_property='children'),
[Input(component_id='main_dropdown', component_property='value')])
@app.callback(
Output(component_id='output_graph', component_property='children'),
[Input(component_id='slider', component_property='value')])
@app.callback(
Output(component_id='slider', component_property='children'),
[Input(component_id='main_dropdown', component_property='value')])
def update_graph(input): # Pull det correct dataframe
# Return graph
return dcc.Graph(
id='tsne_perplexity_plot',
figure={
'data': [
go.Scatter(
{'x': dict['perp' + str(input)]['x'],
'y': dict['perp' + str(input)]['y'],
'mode': 'markers',
'opacity': 0.7,
'marker' : {
'size': 15,
'line': {'width': 0.5, 'color': 'white'}
}
}
)
],
'layout': {
'title': "Perplexity: " + str(input),
# 'plot_bgcolor': colors['background'],
#'paper_bgcolor': colors['background'],
'font': {
'color': colors['text']
},
}
}
)
def update_slider(input):
if(input == 't-SNE'):
return dcc.Slider(
id='slider',
min=0,
max=55,
step=None,
value=20,
marks={
5:'5',
10:'10',
15:'15',
20:'20',
25:'25',
30:'30',
35:'35',
40:'40',
45:'45',
50:'50'
},
updatemode='drag'
)
Thanks! 