Google maps api 3 将Google地图初始化为AMD模块

要将

google.maps

初始化为AMD模块，符合

twitter/flight

和

requirejs

，请使用：

define([
    'components/flight/lib/component',
    'async!http://maps.google.com/maps/api/js?key=AIzaSyDp9D9Db1CWfeGUJ1bin45s2WKZN5sapuM&sensor=false'
], function(defineComponent){

return defineComponent(newMap);

function newMap () {

    this.defaultAttrs({
        // Selector
        mapDiv:         '#map',
        // Map Canvas
        mapCanvas:      {},
        // Initialized?
        initializedMap: false
    });

    this.initializeMap = function () {
    var mapCenter = new google.maps.LatLng(39.960664,-75.605488);

    var mapOptions = {
          zoom: 15,
          center: mapCenter,
          disableDefaultUI: true,
          mapTypeId: google.maps.MapTypeId.ROADMAP,
        };

    this.attr.mapCanvas = new google.maps.Map(document.getElementById("map"), mapOptions);

    if (this.attr.mapCanvas != {} ) {
        this.attr.initializedMap = true;
        this.trigger(document, 'mapInitialized', {
            status: this.attr.initializedMap
        });
    };

    // ### Map events
  //-----------

    // Mouse Up
    google.maps.event.addListener(this.attr.mapCanvas, 'mouseup', function() {
      this.trigger('mouseup');
    });

    // Zoom Changed
    google.maps.event.addListener(this.attr.mapCanvas, 'zoom_changed', function() {
        this.trigger('zoomChanged');
    });

};

this.mouseup = function () {
    console.log("what");
}

this.zoomChanged = function () {
    console.log("is up");
}

  this.after('initialize', function () {
    this.on('mouseup', this.mouseup);
    this.on('zoomChanged', this.zoomChanged);
    this.on('initializeMap', this.initializeMap);

    this.trigger('initializeMap');
  });
}
});

我放了一个，它在异步的基础上增加了一些功能！加载器

require.config({
  googlemaps: {
    params: {
      key: 'abcd1234',        // sets api key
      libraries: 'geometry'   // set google libraries
    }
  }
});
require(['googlemaps!'], function(gmaps) {
  // google.maps available as gmaps
  var map = new gmaps.Map('map-canvas');
});

我放了一个，它在异步的基础上增加了一些功能！加载器

require.config({
  googlemaps: {
    params: {
      key: 'abcd1234',        // sets api key
      libraries: 'geometry'   // set google libraries
    }
  }
});
require(['googlemaps!'], function(gmaps) {
  // google.maps available as gmaps
  var map = new gmaps.Map('map-canvas');
});