mapbox / mapbox/mapbox-gl-js

MaxBounds prevents the map's center from reaching the max bounds in some cases.

Open
#13,223 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

feature :green_apple:
Dominant language
TypeScript
Stars
12.4k
Forks
2.4k
PR merge metrics
No merged PRs in 30d

Description

**mapbox-gl-js version**:
3.5.1
**browser**:
Chrome

### Steps to Trigger Behavior

1. Set max bounds to max lat 90
```
maxBounds: [
[-360, -90],
[360, 90]
],
```
Note how the Map center is able to reach the bounds, and the map displays "empty" area which is desired.

2. Set max bounds to arbitrary bounds
```
maxBounds: [
[-360, -62],
[360, 75]
]
```
The map center is unable to reach the max bounds like before, and no empty area is able to be displayed.

### Link to Demonstration

https://github.com/user-attachments/assets/40444e3f-0c14-4916-beb6-82fbf57f4fdc

## Notes

I understand if this behavior is considered somewhat intentional, but I think there needs to be an option that essentially allows adding empty space, and panning beyond the max bounds until a specific camera edge is reached.

for example we could have:
```
maxBoundsEdges: 'within' | 'centered' | 'contained'

contained: all edges of the camera must be within the max bounds (current behavior except at 90 lat)
centered: the camera center must be within the maxbounds, but edges can go beyond
within: the camera must contain one edge within the maxBounds, but it can pan beyond in all directions.
EX: the left side of the camera can pan up to the right side of the maxBounds and so on.

In all cases, empty space can be displayed when panning outside the bounds.
```

Note I could not get the global `map.setPadding` to have any effect on this

### Expected Behavior
I expect that when the camera attempts to pan to the maxBounds, the map center is able to reach the max bounds, consistent with when the maxBounds are -90, 90.

The behavior of maxBounds with -90, 90 is a much better user experience.

### Actual Behavior
When using a lat that is not -90, 90, the map center is unable to pan to the bound's edges, and no empty space is added beyond the map.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the maxBounds configuration and the linked reproduction, comparing bounds at -90/90 latitude with arbitrary latitude limits. Trace the camera behavior when panning toward each bound and determine the intended behavior for allowing empty space. Done means the reported case lets the map center reach the configured max bounds without regressing the existing -90/90 behavior, with coverage for the relevant bounds cases.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, typescript
Domain
computer-graphics, frontend, web-dev
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.