I want add a custom marker component to the map but I notice that using react-google-maps/api
does not render custom components. As a simple example I used the following code:
const AnyReactComponent = ({ text }) => <div>{text}</div>; ... <GoogleMap mapContainerStyle={containerStyle} center={this.props.center} zoom={this.props.zoom} > {<AnyReactComponent lat={38.26} lng={-7.61} text="My Marker" />} </GoogleMap> ...
It’s possible to do such things with this framework? Also, is possible to add buttons components to an infoBox or, rendering an options section when click on a marker?
Advertisement
Answer
Since the react-google-maps/api
wrapped the google’s API so much, it seems that’s not likely. So, you’ll be limited to the package’s components, but I recommend it for simpler goals because there’s a lot of documentation available. Note that react-google-maps
is no longer maintained, but this project is continued by react-google-maps/api
.