react-google-maps-api icon indicating copy to clipboard operation
react-google-maps-api copied to clipboard

OverlayView container has 0 weight and height always now

Open aleksandrlat opened this issue 1 year ago • 3 comments

Please provide an explanation of the issue

Your Environment

os: any

node --version any

react version any

webpack version any

@babel version any

@react-google-maps/api version 2.19.0

How does it behave?

Zero weight and height are always set to OverlayView container image

How should it behave correctly?

We should not always set zero weight and height to OverlayView container

Basic implementation of incorrect behavior in codesandbox.com

Please see my comment in PR See comment in PR https://github.com/JustFly1984/react-google-maps-api/pull/3260#discussion_r1307931228

I hope it makes sense

aleksandrlat avatar Aug 28 '23 21:08 aleksandrlat

you have to set it yourself. it defaults to 0.

JustFly1984 avatar Sep 02 '23 13:09 JustFly1984

How do you set it? OverlayView does not take a style, width, or height prop 🤷‍♂️

man-trackunit avatar Oct 24 '23 11:10 man-trackunit

This worked for me. Make a ref and attach it to OverlayView and then: ref.current?.containerRef.current?.style.setProperty("width", "auto"); Don't know if there's a better way.

EDIT: While this somewhat worked it was a terrible hack. Turns out the real issue was that I put an svg as marker. When wrapping the svg in a div, I have no issues anymore. 🙌

EDIT 2: Also replaced OverlayView with OverlayViewF which correctly calls getPixelPositionOffset on initial render 🥳 see this

man-trackunit avatar Nov 14 '23 12:11 man-trackunit