需要.js加载谷歌地图及其丰富标记扩展程序的问题

Question

我当前正在尝试加载Google Maps库及其扩展名，Richmarker，使用require.js模块定义和依赖关系处理程序。

我已经声明了Google Maps模块和扩展名的途径如下：

"gmaps": "modules/google_maps",
"richmarker": "vendor/google/maps/richmarker.min"

Google_maps模块看起来像

define('gmaps', ['async!http://maps.googleapis.com/maps/api/js?key=mykey&sensor=true'],
function(){
  return window.google.maps;
});

最后，该模块可以消耗Google Maps库和定义如下的高级标记扩展程序：

define(['common', 'gmaps','jquery','jqueryui',  'bootstrap',"vendor/google/maps/clusterer.min", "tmp/clusteringData", "richmarker"],
function(common, gmaps){

然而，GoogleMap适当地插入了Onload，但是我会在控制台中遇到有关Richmarker扩展程序的错误：

Uncaught ReferenceError: google is not defined richmarker.min.js:1
Uncaught ReferenceError: RichMarker is not defined google.init.js:267

我在哪里做错？感谢您的帮助。

Answer 1

我与infobox.js遇到了同样的问题，严格取决于Google Maps。

我做了什么：

1. 我已经定义了返回整个Google对象的模块google（而不是gmaps）（而不是单个maps属性）

   define('google', ['async!http://maps.googleapis.com/maps/api/js?key=mykey&sensor=true'],
     function() {
       return window.google;
     });
   

2. 我已经在requirejs配置文件中定义了 infobox和 google之间的依赖性：

   paths: {
     google: 'ref/google',
     infobox: 'ref/infobox'
   },
   shim: {
     infobox: {
       deps: ['google']
     }
   }
   

Answer 2

我不久前回答了同样的问题：

https://stackoverflow.com/a/13955963/1916258

我认为您需要"垫片" Google对象。

require.config({
   baseUrl: 'js',
   paths: {
      gmaps: 'path/to/gmaps'
   },
   shim: {
      gmaps: {
         exports: 'google'
      }
   }
});