go.Scattermapbox won't update in the dash app

I want to update the map when I change the sidebar.
It looks like this in Dash. On the right plot this dot represents the count value of hovered data. You can see that map only visualy doesn’t get updated.


I have shown the map that is being created in the callback in Jupyter, and it is being updated properly.

import pandas as pd
import geopandas as gpd
import plotly.graph_objects as go
import math

This is the snipset of my code:

def create_scatter_map(index):
date = df[“day”][index]
df_count = df.loc[df[“day”] == date]
df[“count”] = df[“count”].astype(int)
new_list = [count for count in df_count[“count”]]
print(new_list)
df_tiles[“count”] = new_list
new_list1 = [0 for count in df_count[“count”]]
df_tiles[“color”] = new_list1
print(df_tiles[“count”].min())
scatter_mapbox = go.Scattermapbox(
lat=df_tiles[‘n’],
lon=df_tiles[‘e’],
mode=‘markers’,
marker=go.scattermapbox.Marker(
size=df_tiles[‘count’],
color=df_tiles[‘count’],
sizemode=‘diameter’,
sizemin=4,
sizeref=10, # Update this according to your specific requirement
colorscale=‘Viridis’,
cmin=df_tiles[‘count’].min(), # set color scale minimum to minimum count
cmax=df_tiles[‘count’].max(),
showscale=True,
),
text=new_list,
showlegend=True,

    hoverinfo='text',
    cluster = {"enabled": True, "color":'yellow', "size" : 14}
)
scatter_mapbox.customdata = df_tiles['tile']

# Create a choropleth_mapbox trace for the polygon data (geojson)
gdf["dummy"] = 10

choropleth_mapbox = go.Choroplethmapbox(
    geojson=gdf.geometry.__geo_interface__, 
    locations=gdf.index, 
    z=gdf["dummy"],
    colorscale=[[0, 'rgba(255, 0, 0, 0.1)'], [1, 'rgba(255, 0, 0, 1)']], 
    marker_line_width=10,
    marker_line_color = "red",
    marker_opacity=0.1,
    showscale=False, 
    hoverinfo='skip',
     )
)

# Combine the scatter_mapbox and choropleth_mapbox into one figure
fig = go.Figure(data=[choropleth_mapbox, scatter_mapbox])

# Calculate the bounding box of the GeoJSON
bbox = gdf.geometry.total_bounds

# Calculate the center of the bounding box
center_lat = (bbox[1] + bbox[3]) / 2
center_lon = (bbox[0] + bbox[2]) / 2

# Calculate the zoom level based on the bounding box
zoom = round(math.log(360 / max(bbox[2] - bbox[0], bbox[3] - bbox[1]), 2))

# Update the mapbox style, zoom, and center
fig.update_layout(
    mapbox_style="carto-positron",
    mapbox=dict(
        zoom=zoom,
        center=dict(lat=center_lat, lon=center_lon),
    ),
    autosize=False,
    margin={"r":0,"t":0,"l":0,"b":0},
    width=800,
    height=800
)
return fig

dash = Dash(name)
data = {“1”: “Mon”, “2”: “Tue”, “3”: “Wed”, “4”: “Thu”, “5”: “Fri”, “6”: “Sat”, “7”: “Sun”, “8” : “All”}

dash.layout = html.Div([
html.H1(“Interactive Map”),
html.Div([
dcc.Graph(id=“scatter_map”, hoverData={‘points’: [{‘customdata’: df_tiles[‘tile’][0]}]}),
dcc.Graph(id=“grafic”),
], style={‘display’: ‘flex’}),
# Create slider with values from 0 to 5
dmc.SegmentedControl(
id=“days”,
value=“1”,
data= [{“label”: l, “value”: k} for k, l in data.items()],

        mt=10,
    ),
dcc.Store(id = 'tile_id')

], style={‘display’: ‘flex’, ‘flex-direction’: ‘column’})

@dash.callback(
Output(“scatter_map”, “figure”),
Input(“days”, “value”))
def update_map(value):
#update the map with the new value
index = int(value)
fig = create_scatter_map(index)
fig.show()
return fig

@dash.callback(
Output(“tile_id”, “data”),
Input(“scatter_map”, “hoverData”))
def update_grafic(hoverData):
if hoverData is None or ‘points’ not in hoverData or not hoverData[‘points’]:
print(“Unexpected hoverData:”, hoverData)
return None
a = hoverData[‘points’][0][‘customdata’]
time.sleep(0.1)
print(a)
return a

@dash.callback(
Output(“grafic”, “figure”),
Input(“tile_id”, “data”))
def update_grafic(value):
#update the grafic with the new value

fig = create_grafic(value)
return fig

dash.run_server( debug=True)

(This one just have day selection insteed of slider, but whatever)

It works well with px.scatter_mapbox but I am using only go for consistency purposes. Do you know what could be the problem?