React-google-maps: how to panTo a location?

[SourceNova]

Hi,
I can't use the functions you mad public in the GoogleMap component. For example:
panTo(latLng) { return (this.props.map || this.refs.delegate).panTo(latLng); }

when i try to use panTo on the ref of the map, i get this Error:
TypeError: map.panTo is not a function

my code:
ref={(map) => map.panTo({lat: 25.0112183,lng: 121.52067570000001})}
defaultZoom={12}
onClick={this.props.onMapClick}
...

your help would be much appreciated.

[Gregoor]

try

ref={(map) => map && map.panTo({lat: 25.0112183,lng: 121.52067570000001})}

ref may be called when the element is not yet mounted, hence the method wouldn't be available then.

[tomchentw]

@Gregoor Thanks for answering. Please read the documentation about ref: https://facebook.github.io/react/docs/more-about-refs.html#the-ref-callback-attribute

Also, 6.0.0 is released on npm beta tag now. We also have a new demo page. Feel free to try it:
https://tomchentw.github.io/react-google-maps/

[rajtrivedi88]

Thank You @Gregoor...saved lot of hours.

[manishrana87]

Thanks @Gregoor

[JustFly1984]

@manishrana87 @rajtrivedi88 The repo of this project is unmaintained more than 3 years, and we had build new version https://www.npmjs.com/package/@react-google-maps/api

We had rewrite it to TypeScript, and updating it frequently: https://github.com/JustFly1984/react-google-maps-api/tree/master/packages/react-google-maps-api
You can enjoy autocomplete.

You can see our docs: https://react-google-maps-api-docs.netlify.app

Also a lot of examples: https://react-google-maps-api-gatsby-demo.netlify.app/ https://github.com/JustFly1984/react-google-maps-api/tree/master/packages/react-google-maps-api-gatsby-example/src/examples

The bundle size is much smaller: https://bundlephobia.com/result?p=@react-google-maps/api

Our Spectrum community: https://spectrum.chat/react-google-maps
Our Slack channel: https://join.slack.com/t/react-google-maps-api/shared_invite/enQtODc5ODU1NTY5MzQ4LTBiNTYzZmY1YmVjYzJhZThkMGU0YzUwZjJkNGJmYjk4YjQyYjZhMDk2YThlZGEzNDc0M2RhNjBmMWE4ZTJiMjQ

Enjoy!


[manishrana87]

Thanks @JustFly1984 , for the info