Skip to content

Bug: Labels with pixel offsets (textDx/textDy) jitter during continuous map.setCenter() panning #2691

@fredli4qooni

Description

@fredli4qooni

maptalks.Label geometries, especially those using pixel offsets like textDx or textDy, exhibit a visible "jitter" or "shaking" when the map is panned continuously. This occurs when map.setCenter() is called repeatedly, such as in a requestAnimationFrame loop to follow a moving object.

The jitter appears to be a 1-2 pixel vibration and happens even when the label's own properties are not being changed. The underlying maptalks.Marker (if visible) pans smoothly, but the attached label and its text do not.

Expected behavior
Labels should remain perfectly stable relative to their anchor point and pan smoothly with the map, just as the markers do, without any jitter.

Current behavior
Labels with a textDx or textDy offset visibly shake or jitter on each frame of the continuous pan. The larger the pixel offset, the more noticeable the jitter becomes.

Steps to reproduce

  1. Create a map with a maptalks.VectorLayer.
  2. Add one or more maptalks.Label geometries to the layer.
  3. In the label's textSymbol, set a pixel offset, e.g., textDx: 80.
  4. Create an animation loop using requestAnimationFrame.
  5. Inside the loop, update the map's center coordinate by a small amount and call map.setCenter(newCoords) on every frame.
  6. Observe the map: the labels will shake, while the base map and any non-offset markers pan smoothly.

Live Demo (CodePen)
A live demo reproducing the issue is available here:
https://codepen.io/fredli4qooni/pen/OPMGqoX

  • Check "Auto-move center" to start the continuous pan.
  • Observe the labels (with textDx: 80) shaking.
  • Unchecking "Show Labels" and leaving "Show Markers" on shows that the markers themselves pan smoothly.

Environment

  • MapTalks Version: 0.49.4 (via CDN)
  • Browser: (Reproducible in latest Chrome, Firefox, Edge)
  • OS: (Reproducible in Windows, macOS)

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions