Hi,
So here is my situation: I am building a dash app that displays a scatter plot of each city in France, with the color of each point depending on the city’s score. The score depends on different criteria, with an importance select by the user via sliders. Here is what the interface looks like (all the sliders are 0 here, so the scores are 0 to0, hence the color of the points):
The problem is, that when I move sliders around, the scores become non 0, and the points should change color. Instead, they keep the same color, while the hover menu does take the color it should.
Here’s how the code works:
I have declared a callback function for each slider:
for i in range(len(utils.elt_data_culture)):
# définir les callbacks pour les sliders
@app.callback(
Output('map_par_ville', 'figure'), # my dcc.Graph element
Input(f'slider-{i}', 'value')) # my slider
def update_output(value):
# We get the value of the slider, change it in the sliders_values dict
i = int(ctx.triggered_id.split('-')[1])
key = criteriums[i]
sliders_values[key] = value
# get the dataframe of all the cities with the scores they are atributed
df_villes_classes = utils.classement_villes(sliders_values)
# then get the map
fig = maps_generation.get_sorted_map(df_villes_classes)
return fig
And here is the get_sorted_map function:
def get_sorted_map(df_villes_classes):
fig = px.scatter_mapbox(
df_villes_classes,
lat="lat",
lon="long",
hover_name="NOM_COM",
hover_data={
'Score': True,
'long': False,
'lat': False
},
color='Score',
color_continuous_scale=px.colors.cyclical.IceFire,
center=dict(lat=46.06, lon=1.87),
zoom=5,
mapbox_style='open-street-map')
return fig
My way of declaring multiple callbacks is probaly not the right one, but it should work, and it does works, partially, since hover menus change color, the dots are the only thing not changing colors!
If you have the same issue or have an idea on how to address it, your help is welcome,
Thanks a lot