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

places are not clickable on the map

Open sophiedophie opened this issue 6 years ago • 2 comments

hello,

I'm trying to render google map on my app. However, when I click the place on the map, place info doesn't popup and even the cursor doesn't change.

What I want to see is just this popup, so that if user click the place I want to get location info s/he selected. screen shot 2018-04-22 at 14 23 56

This is how my code is.

class Container extends Component {
  state = {
    showingInfoWindow: false,
    activeMarker: {},
  };

  onMapReady = (mapProps, map) => this.searchNearby(map, map.center);

  onMapClicked = (props) => {
    if (this.state.showingInfoWindow) {
      this.setState({
        showingInfoWindow: false,
        activeMarker: null
      })
    }
  };

  render() {
    if (!this.props.loaded) return <div>Loading...</div>;
    console.log(this.props)
    return (
      <Map
        centerAroundCurrentLocation
        className="map"
        google={this.props.google}
        onReady={this.onMapReady}
        onClick={this.onMapClicked}
        visible={true}
        style={{width: 'inherit', height: 'inherit', zIndex: '9999'}}
        />
    );
  }
}
export default GoogleApiWrapper({
  apiKey: (key)
})(Container)

Is this bug or is there something I miss? please let me know If I miss. Thank you.

sophiedophie avatar Apr 22 '18 05:04 sophiedophie

You have to set clickableIcons to true in the props of the map, as it is deactivated in this library by default.

<Map
    clickableIcons={true}
    ...
/>

FelixSchwarzmeier avatar Jan 31 '19 12:01 FelixSchwarzmeier

@FelixSchwarzmeier working great thanks !

saad277 avatar Aug 27 '23 17:08 saad277