Skip to content

feat: Add min/max scale limits for geo plots #7371

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Open
wants to merge 18 commits into
base: master
Choose a base branch
from
Open

feat: Add min/max scale limits for geo plots #7371

wants to merge 18 commits into from

Conversation

camdecoster
Copy link
Contributor

@camdecoster camdecoster commented Feb 18, 2025 •
edited
Loading

Description

Add minscale and maxscale attributes to geo plots. These set the min and max scale extents for a plot (how far a user can zoom out/in). This PR supersedes #5192 which will be closed after this is merged.

Changes

  • Adds minscale and maxscale attributes to geo plots. Defaults are 0 and -1, respectively.
  • Enforces scale extents on zoom mouse events, mode bar button clicks
  • Manually creates zoom event to enforce scale extents on first render (treating the middle of the plot as the zoom point)

Demo Video or Screenshot(s):

Before:

Screencast.From.2025-02-22.11-25-20.mp4

After:

Screencast.From.2025-02-22.11-29-21.mp4

Testing

  • Start the dev dashboard with npm start
  • Search for a geo mock and load it (I used geo_legendonly)
  • Zoom in and out and note how you can go as far as you want in either direction
  • Edit the mock file and add the following attributes under the "geo" key
    • "minscale": 2
    • "maxscale": 4
  • Reload the mock in the dashboard
  • Note that the mock appears zoomed in upon first load
  • Zoom in and out and note how you're now limited in how far you can go

@camdecoster camdecoster force-pushed the cam/5192/add-min-max-scale-limits branch from c7b5ec3 to 29b4316 Compare February 18, 2025 14:15
@gvwilson gvwilson added P1 needed for current cycle fix fixes something broken labels Feb 18, 2025
@camdecoster
Copy link
Contributor Author

I believe that some tests are failing because there's now an extra zoom event on every call to updateFx (for dragMode === 'pan'). I think I need to restrict that call to only happen upon first load. I'll keep looking into it.

@archmoj archmoj marked this pull request as ready for review July 21, 2025 15:13
This was referenced Jul 21, 2025
Closed
Open
@camdecoster
Copy link
Contributor Author

@archmoj this PR should now be good to review. We don't need both this and #7482. I'd like to argue that we should use the approach of using scaleExtent (the native D3 mechanism) rather than limiting the scale on our side.

archmoj
archmoj reviewed Jul 25, 2025
View reviewed changes
src/plots/geo/layout_attributes.js
maxscale: {
valType: 'number',
min: 0,
dflt: -1,
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's try setting dflt: 0 in the API and handle the case of zero instead of -1.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We represent Infinity with -1 since Infinity isn't valid in JSON. If we made this change, how would we handle when a user wants to use Infinity instead of 0 (which is also a valid value).

@archmoj
Copy link
Contributor

archmoj commented Jul 25, 2025

Opening geo_canadian-cities mock in the dashboard gives me the following error:

plotly.js:9976 Uncaught (in promise) RangeError: Maximum call stack size exceeded
    at String.replace (<anonymous>)
    at stringInputToObject (plotly.js:9976:27)
    at inputToRGB (plotly.js:9412:22)
    at new tinycolor (plotly.js:9165:22)
    at tinycolor (plotly.js:9163:20)
    at color2.fill (plotly.js:11073:18)
    at d3_selectionPrototype.call (plotly.js:1352:20)
    at SVGGElement.<anonymous> (plotly.js:145654:18)
    at plotly.js:1339:22
    at d3_selection_each (plotly.js:1345:36)

@camdecoster do you get the same?

@camdecoster
Copy link
Contributor Author

@archmoj that should be fixed by some recent commits. Are you on the latest version of the branch? I'm not seeing that error.

@archmoj
Copy link
Contributor

archmoj commented Jul 25, 2025

geo_canadian-cities

Thanks @camdecoster. My local test branch was not up-to-date. I confirm now it renders with no error.

@archmoj
Copy link
Contributor

archmoj commented Jul 25, 2025

If you add

"projection": { "minscale": 0.5, "maxscale": 2 },

to geo_canadian-cities under "geo" object, the map renders smaller with gd._fullLayout.geo.projection.scale: 0.3013880580354019.

@camdecoster Could you please investigate that?

@archmoj
Copy link
Contributor

archmoj commented Jul 25, 2025

If you add

"projection": { "minscale": 0.5, "maxscale": 2 },

to geo_canadian-cities under "geo" object, the map renders smaller with gd._fullLayout.geo.projection.scale: 0.3013880580354019.

@camdecoster Could you please investigate that?

Here is a codepen displaying the bug.

@archmoj archmoj added feature something new and removed fix fixes something broken labels Jul 28, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@archmoj archmoj archmoj left review comments

@alexcjohnson alexcjohnson Awaiting requested review from alexcjohnson

@emilykl emilykl Awaiting requested review from emilykl

@marthacryan marthacryan Awaiting requested review from marthacryan

At least 1 approving review is required to merge this pull request.

Assignees

@camdecoster camdecoster

Labels
feature something new P1 needed for current cycle
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

allow user to set zoom/scale limits for choropleth maps
4 participants
@camdecoster @archmoj @gvwilson @mojoaxel