How to stop propagation of events from OverlayView to Map? about react-google-maps HOT 11 CLOSED

I've found a solution that seems to work nicely using the static preventMapHitsFrom and preventMapHitsAndGesturesFrom methods from https://developers.google.com/maps/documentation/javascript/reference/overlay-view#OverlayView.preventMapHitsFrom

In your component or HTML Element within your OverlayView you can call preventMapHitsFrom on your element that you don't want your mouse or touch events filtering down to the map

class OverlayInner extends React.Component {
  handleClick = () => {
    console.log('I still work');
  }
  render () {
    <div
      ref={ ref => ref && google.maps.OverlayView.preventMapHitsFrom(ref) }
      onClick={this.handleClick}
    />
      Dont click map
    </div>
  }
}

Your standard onClick events will continue to work.

from react-google-maps.

Wow... is that new @madrussa? That's worked perfectly.

I spent over a year looking for a fix for that...

from react-google-maps.

Actually, I've found a workaround: added overlayHovered flag to the state and check it in handleMapClick function.

from react-google-maps.

Second that. As I understand, this is not the intended behavior of Google Maps. It breaks the use case when OverlayView is used to display a menu, which is closed by clicking on the map.

from react-google-maps.

I've noticed the same behavior in the #basics/overlay-view example.

from react-google-maps.

Having the same issue here, was there a better solution for this?

from react-google-maps.

Feel free to submit a PR. Close for now

We're also looking for maintainers. Involve in #266 to help strengthen our community!

from react-google-maps.

Anyone find a good solution for this?

from react-google-maps.

This seems to be a bug inherent in google maps.

One guy said he found a fix, but that didn't work for me...

And the hover solution suggested by @ksavenkov and another guy in this stackoverflow thread doesn't work on mobile, so not a long term fix.

I've had to deal with this issue a year ago, and now coming back to it again. I think it's getting to a point where I'd pay money

from react-google-maps.

up please

from react-google-maps.

Yeah it looks new. I can see it in 3.33 but not 3.32. My only concern is that it's a black hole and it could lead to memory leaks... as you feed it references, but what happens when they remove?

from react-google-maps.