Skip to content

Conversation

mrMetalWood
Copy link
Collaborator

@mrMetalWood mrMetalWood commented Oct 7, 2025

This fixes a few issues with the AdvancedMarker when using anchor points. Issues where introduced when Google Maps started to use the gmp-advanced-marker element by default for the marker.

I tried multiple approaches to achieve a "clean" solution, but none of them worked 100%.

Changes:

  • Add a data-origin="rgm" attribute to the gmp-advanced-marker to be able to overwrite the pointer events with a global style tag and to only target the markers originating from this library
  • Moving the anchor points translation to the first child of the marker for the collision detection to work correctly
  • Introducing a global style helper to be able to inject a style tag with custom styles
  • Also made some adjustments to the example

Explanations

Collision detection:

  • Google Maps already correctly used the marker content for collision detection. But it looks at the position of the first child. I now moved our translates to the first child instead of a deeper nested element like before.
  • The cleanest solution would be to translate the whole marker, but that breaks collision detection. Apparently the Google Maps API determines the collision detection by the difference between marker container and content. When there is no difference collision detection is based on original bottom/center anchor point

Pointer events:

  • Issue: As soon as there is an onClick event listener for the marker, the marker container gets all pointer events. That means when content is translated by an anchor point, mouse events are also triggered when hovering over the "ghost" element.
  • I found no other solution than to overwrite the pointer events for the gmp-advanced-marker

This is what I found to be the least intrusive solution.

fixes #819

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Bug] anchorPoint creates duplicated clickable area

1 participant