relayoutData from Scattermapbox graph doesn't contain zoom anymore

Dash Python
1

Hi all,

I’m trying to build an app around a map interface. I’m using the scattermapbox chart type for this, and would like to update the data on the map while maintaining zoom and location fo the map.

I’ve achieved this in the past via something like this:

segment_map = dcc.Graph(
    id='segments_selection_map',
    figure=go.Figure(
        data=go.Data([go.Scattermapbox()]),
        layout=go.Layout(
            showlegend=False,
            mapbox=default_mapbox_dict,
            height=600,
            margin={'l': 0, 'r': 0, 'b': 0, 't': 0, 'pad': 4}
        )
    )
)

@app.callback(
    Output('segments_selection_map', 'figure'),
    [Input('oa_store', 'children')],
    [State('segments_selection_map', 'relayoutData')]
)
def update_map(oas, figure=None):
    if figure is not None:
        print(figure)
        lat = figure['mapbox']['center']['lat']
        lon = figure['mapbox']['center']['lon']
        zoom = figure['mapbox']['zoom']
else:
        lat = 53
        lon = -1
        zoom = 7

    mapbox = {
        'center': {'lat': lat, 'lon': lon},
        'zoom': zoom,
        'bearing': 0,
        'style': 'dark',
        'accesstoken': mapbox_access_token,
        'dragmode': 'lasso'
    }
    etc...

However, with dash-core-components==0.23.0, relayoutData doesn’t contain the mapbox information anymore, and I get a key-error. Is this expected behaviour? How should the map state be maintained?

2

Hi there,

It looks like this is a bug originating in plotly.js, where zoom isn’t triggering a plotly_relayout event.

I created an issue to monitor this. You can watch it yourself here: https://github.com/plotly/plotly.js/issues/2702

1 Like
3

Thanks - yes, I noticed now that it works on panning. Helpful to know where it originates.

Thanks as well for creating the issue!