google-maps-api-react-provider package

This library is the root library for using components from the google-maps-api-react ecosystem in our code. The MapsApiProvider component provides child components with access to Google Maps JavaScript API. This library itself will not draw anything to the screen. It is auxiliary for google-maps-api-react-map

To draw a map, use the package google-maps-api-react-map .

The google-maps-api-react ecosystem provides very simple bindings to the Google Maps API and allows you to use it in your application as React components. At the moment it only includes working with the Google map, but over time we will collect all the Google Maps tools, such as places, routes, etc.

[!IMPORTANT] This library requires React v16.8 or later.

Installation

npm install --save google-maps-api-react-provider 

or

yarn add google-maps-api-react-provider

General Usage

importing the MapsApiProvider component from the library

import { MapsApiProvider } from "google-maps-api-react-provider";

and now we can wrap our components from the ecosystem google-maps-api-react, such as the map from google-maps-api-react-map

return (
    <MapsApiProvider apiKey = " your google maps api key ">
      {/* 
        any other components. Now any nested component will have access to the google maps api
       */}
    </MapsApiProvider>
  );

Next.js

[!IMPORTANT] To use the library in a Next.js project, you need to make the component client-side.