Attempting to implement Google Maps Autocomplete API, where to place JS to back it?


#1

I’m trying to implement the Google Maps autocomplete API in my web application, and have managed to load the JS file they provide to support it, but have not been able to figure out where to define functions that actually do something with that API. Here is the snippet of code I would want to include in the client side of the app in order to perform actions with the API. It seems to load, but I can’t seem to access any of the functions defined in it.

Any help is greatly appreciated.


#2

I’ve recently used https://github.com/tomchentw/react-google-maps to build a map assisted address autocomplete + fill in the missing parts kind of address entry component. If you are using react, I found this to be quite a good abstraction.

Otherwise, you can take cue from how they load the google scripts: https://github.com/tomchentw/react-google-maps/blob/master/src/withScriptjs.jsx#L60 using https://www.npmjs.com/package/scriptjs


#3

YMMV, but we are still using dburles:google-maps and then do this in startup:

GoogleMaps.load({
  key: 'someKey',
  libraries: 'places',
  v: '3.29',
});