Load Google Maps API using jQuery Deferred.

bower.json

{
  "name": "load-google-maps",
  "version": "1.0.0",
  "authors": ["Glenn Baker", "Gavin Foley", "Matteo Gaggiano"],
  "description": "Load Google Maps API using jQuery Deferred.",
  "main": "load-google-maps.js",
  "keywords": ["Google Maps", "Async"],
  "license": ["MIT", "GPL"],
  "dependencies": {
    "jquery": ">=1.5"
  }
}

load-google-maps.js

/*!
 * JavaScript - loadGoogleMaps( version, apiKey, language, sensor, libraries )
 *
 * - Load Google Maps API using jQuery Deferred. 
 *   Useful if you want to only load the Google Maps API on-demand.
 * - Requires jQuery 1.5
 *
 *   UPDATES by Gavin Foley
 * - Tidied JS & made it JSLint compliant
 * - Updated script request to Google Maps API to be protocol relative
 * - Added "sensor" parameter which defaults to false if not present
 * 
 *   UPDATES by Matteo Gaggiano
 * - Added "libraries" parameter which can be passes ad array or string. i.e. ['places','geometry'] or "places,geometry"
 * 
 * Copyright (c) 2011 Glenn Baker
 * Dual licensed under the MIT and GPL licenses.
 */
/*globals window, google, jQuery*/
var loadGoogleMaps = (function ($, window) {
    "use strict";

    var now = $.now(),
        promise;

    return function (version, apiKey, language, sensor, libraries) {
        if (promise) {
            return promise;
        }

        //Create a Deferred Object
        var deferred = $.Deferred(),
            //Declare a resolve function, pass google.maps for the done functions
            resolve = function () {
                deferred.resolve(window.google && window.google.maps ? window.google.maps : false);
            },
            //global callback name
            callbackName = "loadGoogleMaps_" + (now++),

            // Default Parameters
            params = $.extend({
                "sensor": sensor || "false"
            },
            apiKey ? {
                "key": apiKey
            } : {},
            language ? {
                "language": language
            } : {},
            libraries ? {
                "libraries": $.isArray(libraries) ? libraries.join(',') : ""+libraries
            } : {});

        //If google.maps exists, then Google Maps API was probably loaded with the <script> tag
        if (window.google && window.google.maps) {
            resolve();
            //If the google.load method exists, lets load the Google Maps API in Async.
        } else if (window.google && window.google.load) {
            window.google.load("maps", version || 3, {
                "other_params": $.param(params),
                    "callback": resolve
            });
            //Last, try pure jQuery Ajax technique to load the Google Maps API in Async.
        } else {
            //Ajax URL params
            params = $.extend(params, {
                'callback': callbackName
            });

            //Declare the global callback
            window[callbackName] = function () {
                resolve();

                //Delete callback
                setTimeout(function () {
                    try {
                        delete window[callbackName];
                    } catch (e) {}
                }, 20);
            };

            //Can't use the jXHR promise because 'script' doesn't support 'callback=?'
            $.ajax({
                dataType: 'script',
                data: params,
                url: '//maps.googleapis.com/maps/api/js'
            });

        }

        promise = deferred.promise();

        return promise;
    };

})(jQuery, window);

sample-example.js

$(elem).on("myevent", function() {
  $.when( loadGoogleMaps( 3, API_KEY, LANG, SENSOR, LIBRARIES ) )
    .then(function() { // or .done(...)
      !!google.maps // true
    });
});