There are two most popular react abstraction of google maps API(judging by the weekly npm downloads and github repo stars). For a beginner like me, it is very confusing as I am not able to decide what can these libraries bring to my project and what not by merely looking at the documentation?
In short what are the pros and cons of using google-map-react and react-google-maps. I didn't find any comparison on the internet or SO.
google-map-react is a component written over a small set of the Google Maps API. It allows you to render any React component on the Google Map. It is fully isomorphic and can render on a server. Additionally, it can render map components in the browser even if the Google Maps API is not loaded.
Since google-map-react allows us to render any React component on the map, we can create a simple component that displays a pin icon and text.
react-leaflet is the most versatile mapping library available. While google-map-react is good if you want to use the Google Maps API, one of the great things about react-leaflet is that you aren't bound to any particular mapping service.
Be carefull, react-google-maps
project is unmaintained more than a year, see
https://github.com/tomchentw/react-google-maps/issues/986
They suggest to look at @react-google-maps/api but it is quite a young project and doesn't have a lot of stars on GitHub yet.
I personally like google-map-react which is still under (quite active) development.
I found the google-maps-react documentation a bit confusing because it utilizes a HOC, compose, to simplify the map. For those new to React, it might be easier to start without compose.
react-google-maps, a package that essentially provides a React component wrapper for the Google Maps API. react-google-maps allows users to use the full functionality of Google Maps Javascript API.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With