Auto center/zoom for scattermapbox

[nicolaskruchten]

Right now with scattermapbox we have to manually set center and zoom but it would be great to have a flag that uses the built-in Mapbox machine to fit bounds. Something like layout.mapbox.fitbounds: true | false

https://www.mapbox.com/mapbox-gl-js/example/fitbounds/

[alexcjohnson]

This is equivalent to autorange for cartesian axes, so has all the same issues with figure mutation and impliedEdits. Seems to me the ideal - though this may need to happen in a major bump - would be no new attribute at all, just better defaults. So if you omit both center and zoom we automatically invoke fitbounds. Likewise if you only provide center we tell mapbox to pick a zoom that still shows all the data (but if you just changed center by panning in the GUI, zoom should not change!), and if you only provide zoom we use the same center as fitbounds would use.

[nicolaskruchten]

Oh to be clear, I thought this would just call the native MapBox fitBounds after rendering, and not actually write the data back to the figure :)

[alexcjohnson]

Of course - we can avoid pushing center and zoom back into the figure, at least with an appropriate stash of the auto results. But the impliedEdits complications will still be there... say the user zooms (either via GUI or some other interface like RCE): we'll need to explicitly clear fitbounds, then center is no longer set automatically so we'll need to explicitly pull into the figure whatever the auto center value was. All of this is much simpler if auto, rather than being an attribute in its own right, is just the absence of an explicit value, like in the histogram autobin revamp #3044.

[etpinard]

#4419 implements (or attempts to) fitbounds on geo subplot.

Mapbox subplots should be able to reuse much of the logic there.

[nicolaskruchten]

Awesome! Sorely needed in Mapbox-land :)

[Krichardson846]

Hello! Are there any updates on this feature? This is one feature that would really save my dash app a lot of troubles!

[greenafrican]

Is there any update on this for mapbox subplots? I'm moving from geo to mapbox subplots and would have to manually find the zoom levels for each (over 5000) region (can get the center from d3.geoCentroid).

Is there any way to access the calculated or inferred zoom and center when fitbounds is set to locations for geo subplots?

[nicolaskruchten]

We’ll definitely post an update once we have one :)

I don’t have a good workaround for you at the moment either unfortunately.

[jackparmer]

This issue has been tagged with NEEDS SPON$OR

A community PR for this feature would certainly be welcome, but our experience is deeper features like this are difficult to complete without the Plotly maintainers leading the effort.

Sponsorship range: $10k-$15k

What Sponsorship includes:

• Completion of this feature to the Sponsor's satisfaction, in a manner coherent with the rest of the Plotly.js library and API
• Tests for this feature
• Long-term support (continued support of this feature in the latest version of Plotly.js)
• Documentation at plotly.com/javascript
• Possibility of integrating this feature with Plotly Graphing Libraries (Python, R, F#, Julia, MATLAB, etc)
• Possibility of integrating this feature with Dash
• Feature announcement on community.plotly.com with shout out to Sponsor (or can remain anonymous)
• Gratification of advancing the world's most downloaded, interactive scientific graphing libraries (>50M downloads across supported languages)

Please include the link to this issue when contacting us to discuss.

[ainar]

It seems that Plotly Express already find the right level of zoom and center... How is it done?

[nicolaskruchten]

Plotly Express does not automatically fix the zoomlevel, and the center is just done with the centroid of the scatter points.

Note that the problem in Plotly.js is a bit more complex as a mapbox subplot can have multiple traces on it, including choropleths etc. Plotly Express has access to the entire dataset up front, and px.scatter_mapbox only makes scatter traces, so computing the centroid is much easier.

[pencilcheck]

Right now it seems like the best workaround is to add layout

fig.update_layout(
    autosize=True, hovermode='closest',
    mapbox = {
        'accesstoken': token,
        'center': dict(lat=40.7479944, lon=-73.9893633),
        'style': "outdoors", 'zoom': 10},
    showlegend = False)

To center and zoom in manually