mapbox / mapbox/mapbox-gl-js

Redundant animation between identical camera states

Open
#8,054 2 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

bug :lady_beetle: performance :zap:
Dominant language
TypeScript
Stars
12.4k
Forks
2.4k
PR merge metrics
No merged PRs in 30d

Description

**mapbox-gl-js version**: v0.53.1

**browser**: All

### Steps to Trigger Behavior

1. Call `map.easeTo()` or `map.flyTo()` with `options.center` set to the current map center.
2. Observe symbol jitter and firing of `'move'` event.

### Expected Behavior

The map should not repaint and the `'move'` event should not fire because the map is not moving.

### Actual Behavior

The map renders redundant frames and and fires the `'move'` event repeatedly for 500ms (the default animation duration). If you look carefully, there is a very subtle jitter of symbol icons during the animation. This is more noticeable on low resolution screens.

A common action that triggers this behavior is clicking the zoom in button on a map at that's already at maximum zoom.

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

Begin at map.easeTo() and map.flyTo(), reproducing the issue with center set to the current map center on v0.53.1. Done means identical camera states produce no redundant animation, repaint, or 'move' event; also verify the maximum-zoom button scenario.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.