Markers shift slightly when the map is double clicked

[C2thehris]

When a user is using a map with custom markers, the markers shift slightly when the map is double clicked. This is most visible when the map has a fixed zoom or is at its highest zoom level.

mapbox-gl-js version: Latest

browser: Any (Tested with Chromium + Firefox)

Steps to Trigger Behavior

1. Zoom into the highest zoom level (or a use a map with fixed zoom)
2. Double click on the map
3. Markers sometimes shake slightly

Link to Demonstration

This can be seen by using the custom-markers demo. (see below video)

Expected Behavior

https://github.com/user-attachments/assets/7250fed0-3b62-4e1e-b851-2a68f9f50b70
https://github.com/user-attachments/assets/1ecad5c0-9133-4cfa-946f-34623b88225e

Actual Behavior

https://github.com/user-attachments/assets/85cf749d-b01c-414d-8f1b-05580dfea41e
https://github.com/user-attachments/assets/0f9666e4-8287-4068-aaac-0b4540d0c305

[C2thehris]

This issue is caused by

mapbox-gl-js/src/ui/marker.ts

Line 594 in 596da6b

this._updateDOM();

The marker does not snap to a rounded pixel (as intended by #11167). I think the solution here would be to round the coordinates here if the marker's position hasn't changed.

My workaround (which doesn't preserve the nice behavior for animated markers) is (uses react-map-gl):

  useEffect(() => {
    if (markerRef.current == null) return;
    const marker = markerRef.current;
    marker._updateMoving = () => marker._update();
  }, [markerRef.current]);