Importing Google Maps

Help
#1

Love this site and your Tutorials @curran. I recently wanted to explore multi component interaction with a google maps component. To do this I started by following this codepen here, and added <script src="https://cdn.jsdelivr.net/npm/react-google-maps-api@1.0.8/lib/index.min.js"></script> to my index.html. But I received an Uncaught ReferenceError: exports is not defined error.

Any tips or insight on how to import a google map component (the actual library is immaterial, if there’s a better one I’m all ears) and have it render would be greatly appreciated!

#2

I’m not sure. Can you share the link to the broken viz?

I’ve had bad experiences around vendor lock-in and restrictive licensing trying to use Google Maps as a library in actual projects.

I would recommend looking into Mapbox instead. Mapbox is designed to build on top of and can be used for visualization, where Google Maps is not nearly as strong an offering when it comes to customization and flexibility. There is an open source fork of Mapbox v1 called MapLibre that is also a solid choice.

Good luck!

1 Like
#3

It’s all good, thank for you this pointer. I’ve since moved on from GoogleMaps to MapBox to get a proof of concept going.

1 Like