javascript - Require.js 问题加载谷歌地图和它的 Richmarker 扩展

Question

我目前正在尝试加载 Google map 库及其扩展程序 RichMarker ，使用 require.js 模块定义和依赖处理程序。

我已经声明了谷歌地图模块和扩展的路径，如下所示:

"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 map 库和 advancedMarker 扩展的模块定义如下:

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

我对严格依赖于 Google map 的 infobox.js 也有同样的问题。

我做了什么:

1. 我定义了返回整个 google 对象(而不是单个 maps 属性)的模块 google(而不是 gmaps) )

   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']
     }
   }