load-google-maps-api

load-google-maps-api

A thin, Promise-returning helper for loading the Google Maps JavaScript API.

Usage

import loadGoogleMapsAPI from 'load-google-maps-api';

loadGoogleMapsAPI().then((googleMaps) => {
  console.log(googleMaps); //=> Object { Animation: Object, ...
}).catch((err) => {
  console.error(err);
});

Read the source to understand how this works.

N.B. Just like the Google Maps API itself, this module is client-side only.

Why

Without this module, you would need to specify a named global callback, and pass said callback’s name as a parameter in the script tag’s src. For example:

<script>
window.googleMapsOnLoad = () => {
  // `google.maps` available here
}
</script>
<script async defer src="https://maps.googleapis.com/maps/api/js?callback=googleMapsOnLoad"></script>

This module abstracts this ceremony away, and fits better with Browserify or Webpack.

API

import loadGoogleMapsAPI from 'load-google-maps-api';

loadGoogleMapsAPI([opts])

Returns a Promise.

• Fulfilled if load was successful. The fulfilled callback is passed the google.maps object.
• Rejected if we weren’t able to load the Google Maps API after opts.timeout.

opts is an object literal:

Key	Description	Default
libraries	Supplemental libraries to load	[]
key	Your API key	undefined
client	The client ID	undefined
v	API version	undefined
timeout	Time in milliseconds before rejecting the promise	10000

Installation

Install via npm:

$ npm i --save load-google-maps-api

License

MIT