Skip to content
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

White flickering of the map when resizing the window #4158

Closed
Kurioni opened this issue May 23, 2024 · 1 comment · Fixed by #4632
Closed

White flickering of the map when resizing the window #4158

Kurioni opened this issue May 23, 2024 · 1 comment · Fixed by #4632
Labels
bug Something isn't working PR is more than welcomed Extra attention is needed

Comments

@Kurioni
Copy link

Kurioni commented May 23, 2024 •
edited
Loading

Hi all!
Recently I encountered a problem when using a library in a project. When I changed the size of the window (respectively, if the size of the <canvas> changed), I noticed that the map began to flicker white. I started researching this problem, I noticed that this problem has existed for a long time, but it turns out it still exists. I opened the examples on your site and noticed that this problem was also reproduced there.

screencast-maplibre.org-2024.05.webm

maplibre-gl-js version: 4.3.2

browser: Chrome 124.0.6367.210

Steps to Trigger Behavior

  1. Open any example on the site, for example: https://maplibre.org/maplibre-gl-js/docs/examples/fullscreen/
  2. Slowly resize window

Link to Demonstration

Expected Behavior

When resizing the window, the map should not flicker.

Actual Behavior
@Kurioni Kurioni changed the title White flickering of the map when resizing the window White flickering of the map when resizing the window [bug] May 23, 2024
@Kurioni Kurioni changed the title White flickering of the map when resizing the window [bug] White flickering of the map when resizing the window May 23, 2024
@HarelM
Copy link
Collaborator

HarelM commented May 23, 2024

Yup, this has been a pain point from the dawn of history.
In most cases, window resizes are sparse, so the flickering is minimal.
Feel free to dive into it!

@HarelM HarelM added bug Something isn't working PR is more than welcomed Extra attention is needed labels May 23, 2024
@daylightwarbler daylightwarbler mentioned this issue Jul 18, 2024
Closed
6 tasks
@pstaszek pstaszek mentioned this issue Aug 31, 2024
Merged
8 tasks
alexandresoro pushed a commit to alexandresoro/ouca that referenced this issue Sep 22, 2024
@alexandresoro
fix(deps): update dependency maplibre-gl to v4.7.0 (#52)
c1eb6a5 
This PR contains the following updates:

| Package | Type | Update | Change |
|---|---|---|---|
| [maplibre-gl](https://maplibre.org/) ([source](https://github.com/maplibre/maplibre-gl-js)) | dependencies | minor | [`4.5.2` -> `4.7.0`](https://renovatebot.com/diffs/npm/maplibre-gl/4.5.2/4.7.0) |

---

### Release Notes

<details>
<summary>maplibre/maplibre-gl-js (maplibre-gl)</summary>

### [`v4.7.0`](https://github.com/maplibre/maplibre-gl-js/blob/HEAD/CHANGELOG.md#470)

[Compare Source](maplibre/maplibre-gl-js@v4.6.0...v4.7.0)

##### ✨ Features and improvements

-   Support multiple layers in `map.on`, `map.once` and `map.off` methods ([#&#8203;4570](maplibre/maplibre-gl-js#4570))
-   Ensure GeoJSON cluster sources emit a console warning if `maxzoom` is less than or equal to `clusterMaxZoom` since in this case you may see unexpected results. ([#&#8203;4604](maplibre/maplibre-gl-js#4604))

##### 🐞 Bug fixes

-   Heatmap Fix for 3D terrain ([#&#8203;4571](maplibre/maplibre-gl-js#4571))
-   Fix Map#off to not remove listener with layer(s) registered with Map#once ([#&#8203;4592](maplibre/maplibre-gl-js#4592))
-   Improve types a bit for `addSource` and `getSource` ([#&#8203;4616](maplibre/maplibre-gl-js#4616))
-   Fix the color near the horizon when terrain is enabled without any sky ([#&#8203;4607](maplibre/maplibre-gl-js#4607))
-   Fix bug where `fitBounds` and `cameraForBounds` would not display across the 180th meridian (antimeridian)
-   Fix white flickering on map resize ([#&#8203;4158](maplibre/maplibre-gl-js#4158))
-   Fixed a performance regression related to symbol placement ([#&#8203;4599](maplibre/maplibre-gl-js#4599))
-   Fix a bug where cloning a Transform instance didn't include the `lngRange`. This caused a bug where
    using `transformCameraUpdate` caused the `maxBounds` to stop working just for east/west bounds. ([#&#8203;4625](maplibre/maplibre-gl-js#4625))

### [`v4.6.0`](https://github.com/maplibre/maplibre-gl-js/blob/HEAD/CHANGELOG.md#460)

[Compare Source](maplibre/maplibre-gl-js@v4.5.2...v4.6.0)

##### ✨ Features and improvements

-   Prefer local glyph rendering for all CJKV characters, not just those in the CJK Unified Ideographs, Hiragana, Katakana, and Hangul Syllables blocks. ([#&#8203;4560](maplibre/maplibre-gl-js#4560)))

##### 🐞 Bug fixes

-   Fix right-to-left layout of labels that contain characters in the Arabic Extended-B code block. ([#&#8203;4536](maplibre/maplibre-gl-js#4536))
-   Fix 3D map freezing when camera is adjusted against map bounds. ([#&#8203;4537](maplibre/maplibre-gl-js#4537))
-   Fix `getStyle()` to return a clone so the object cannot be internally changed ([#&#8203;4488](maplibre/maplibre-gl-js#4488))
-   Fix issues with setting sky to `undefined` ([#&#8203;4587](maplibre/maplibre-gl-js#4587)))

</details>

---

### Configuration

📅 **Schedule**: Branch creation - At any time (no schedule defined), Automerge - At any time (no schedule defined).

🚦 **Automerge**: Disabled by config. Please merge this manually once you are satisfied.

♻ **Rebasing**: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox.

🔕 **Ignore**: Close this PR and you won't be reminded about this update again.

---

 - [ ] <!-- rebase-check -->If you want to rebase/retry this PR, check this box

---

This PR has been generated by [Renovate Bot](https://github.com/renovatebot/renovate).
<!--renovate-debug:eyJjcmVhdGVkSW5WZXIiOiIzOC40Ny4wIiwidXBkYXRlZEluVmVyIjoiMzguODYuMCIsInRhcmdldEJyYW5jaCI6Im1haW4iLCJsYWJlbHMiOlsiZGVwZW5kZW5jaWVzIl19-->

Reviewed-on: https://git.tristess.app/alexandresoro/ouca/pulls/52
Reviewed-by: Alexandre Soro <code@soro.dev>
Co-authored-by: renovate <renovate@git.tristess.app>
Co-committed-by: renovate <renovate@git.tristess.app>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
bug Something isn't working PR is more than welcomed Extra attention is needed
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Fix: resizing map (window) causes white flickering pstaszek/maplibre-gl-js
2 participants
@HarelM @Kurioni