@googlemaps/js-api-loader
    TypeScript icon, indicating that this package has built-in type declarations

    1.12.1 • Public • Published

    Google Maps JavaScript API Loader

    npm Build Release codecov GitHub contributors semantic-release Discord

    Description

    Load the Google Maps JavaScript API script dynamically. This takes inspiration from the google-maps npm package but updates it with ES6, Promises, and TypeScript.

    Install

    Available via npm as the package @googlemaps/js-api-loader.

    npm i @googlemaps/js-api-loader

    or

    yarn add @googlemaps/js-api-loader

    Alternatively you may add the umd package directly to the html document using the unpkg link.

    <script src="https://unpkg.com/@googlemaps/js-api-loader@1.0.0/dist/index.min.js"></script>

    When adding via unpkg, the loader can be accessed at google.maps.plugins.loader.Loader.

    Documentation

    The reference documentation can be found at this link. The Google Maps JavaScript API documentation is the authoritative source for the loader options.

    Example

    import { Loader } from '@googlemaps/js-api-loader';
    
    const loader = new Loader({
      apiKey: "",
      version: "weekly",
      libraries: ["places"]
    });
    
    const mapOptions = {
      center: {
        lat: 0,
        lng: 0
      },
      zoom: 4
    };

    Using a promise for when the script has loaded.

    // Promise
    loader
      .load()
      .then((google) => {
        new google.maps.Map(document.getElementById("map"), mapOptions);
      })
      .catch(e => {
        // do something
      });

    Alternatively, if you want to use a callback.

    // Callback
    loader.loadCallback(e => {
      if (e) {
        console.log(e);
      } else {
        new google.maps.Map(document.getElementById("map"), mapOptions);
      }
    });

    View the package in action here.

    Support

    This library is community supported. We're comfortable enough with the stability and features of the library that we want you to build real production applications on it.

    If you find a bug, or have a feature suggestion, please log an issue. If you'd like to contribute, please read How to Contribute.

    Keywords

    Install

    npm i @googlemaps/js-api-loader

    DownloadsWeekly Downloads

    152,190

    Version

    1.12.1

    License

    Apache-2.0

    Unpacked Size

    292 kB

    Total Files

    11

    Last publish

    Collaborators

    • avatar
    • avatar