Go Scattermapbox Does Not Update

Dash Python
1

I have a simple app with a button and a dcc.Graph whose figure is a go.Figure with a trace of go.Scattermapbox.

The purpose is to generate markers (in random locations). The number of makers should match the number of clicks.

The issue is that the figure data gets updated in the callback, yet the new markers are not rendered.

Weirdly enough, you can still hover over them as shown in this screenshot:

image
image1920×622 32.5 KB

Tested using Dash 2.8.0, 2.7.0 and 2.6.2

import pandas as pd
import plotly.graph_objects as go
import numpy as np
import dash
from dash import dcc, html, Input, Output, callback, State


def generate_map(N):
    fig = go.Figure()
    df = pd.DataFrame({"lat":np.random.random(N), "lon":np.random.random(N)})

    fig.add_trace(
        go.Scattermapbox(lat=df.lat, lon=df.lon, mode="markers", marker=dict(size=15, color="red"))
    )

    fig.layout.update(title={
        'xanchor': 'center',
        'yanchor': 'top'
    },
        showlegend=False,
        margin={
            "r": 0,
            "t": 0,
            "l": 0,
            "b": 0
        },
        mapbox=go.layout.Mapbox(
            uirevision="foo",
            style="carto-positron",
            zoom=3,
            center_lat= np.random.random(),
            center_lon= np.random.random(),
        ))

    return fig




app = dash.Dash(__name__)
app.layout = html.Div(
    children=[
        html.Button("Click me",id="btn",n_clicks=0),
              dcc.Graph(id="orders-map",
                        style=dict(height="100%",width="100%"))]
)



@callback(
    Output("orders-map","figure"),
    Input("btn","n_clicks"),
    State("orders-map","figure")
)
def update_map(n_clicks, old_figure):
    print(f"updated using {n_clicks}")
    if old_figure:
        print("Old data:", old_figure['data'])
    new_figure = generate_map(n_clicks)
    print("New data:", new_figure['data'])
    return new_figure


if __name__ == '__main__':
    app.run_server(debug=True, port=9090)

May I know how to solve this?

2

Thanks for reporting, @yaseen

I opened a github issue about this.