mapbox / mapbox/mapbox-gl-js

Terrain exaggeration with zoom expression results in flickering

Open
#11,044 2 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

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

Description

mapbox-gl-js version: latest/2.5.0-beta.1

browser: Chrome 93

Steps to Trigger Behavior
  1. Use zoom expression for terrain exaggeration, e.g. map.setTerrain({"exaggeration": ["interpolate", ["linear"], ["zoom"], 12, 1, 15, 0 ]});
  2. Zoom
Link to Demonstration

https://jsfiddle.net/hywpmjce/1/

zoom-flickering

(shows some flickering, but due to 30fps capture of 60fps frame by frame flickering, most of the flickering is removed)

Expected Behavior

Valid zoom expressions for exaggeration aren't rendered unusable by flickering.

Actual Behavior

The map enters a feedback loop:

  1. camera position depends on terrain exaggeration (because of transform logic)
  2. terrain exaggeration depends on zoom (due to zoom expression)
  3. zoom depends on camera position (due to re-centering of camera—which normally occurs only on idle but maybe is occurring on every frame due to the modification of exaggeration? I'm not 100% certain about the trigger for this part.)

I believe one way to exit this feedback loop would be to avoid or defer the camera recentering when the exaggeration is modified. At the very least, it would be nice if the style spec would not accept an expression that it cannot successfully render.

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

Reproduce the behavior using the linked JSFiddle and the setTerrain call with a zoom expression. Trace the terrain exaggeration, camera position, and camera recentering interactions described in the report; done means valid exaggeration expressions no longer cause visible flickering while zooming.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
computer-graphics, frontend
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.