如何使用RequireJS加载Google Maps API？ [英] How to load Google Maps API with RequireJS?

问题描述

我正努力在requireJS中加载gmaps api。这是我试过的：

  requirejs.config（{
 urlArgs：noCache =+（new日期）.getTime（），
路径：{
jquery：vendor / jquery-1.8.2.min，
bootstrap：vendor / bootstrap.min， 
underscore：libs / underscore-min，
backbone：libs / backbone-min，
template：libs / template，
 gmaps：http://maps.google.com/maps/api/js?v=3&sensor=false
}，
 shim：{
'backbone'： {
 deps：['jquery'，'undercore']，
 exports：'Backbone'
}，
'下划线'：{
 exports：'_' 
}，
'bootstrap'：{
 deps：['jquery'] 
}，
'gmaps'：{
 deps：['jquery '] 
}，
'main'：{
 deps：['jquery'，'gmaps'] 
} 
 } 
}）; 
 $ b $ require（[main]，function（main）{}）
  

<但是在main.js里面，当我尝试实例化地理编码器时，我得到了,, undefined不是函数错误。

  var geocoder = new google.maps.Geocoder（）; 
  

任何想法我可能做错了什么？

解决方案

我已经设法将它与

一个简单的例子是：

$ p $ require.config（{
paths：{
'async'：'lib / requirejs-plugins / src / async'
} $ b $函数（）{
//）;

define（['async！http：//maps.google.com/maps/api/js？sensor = false']， Google Maps API及其所有依赖项将在这里加载。
}）;


I am struggling to load gmaps api with requireJS . This is what I've tried:

requirejs.config({
    urlArgs: "noCache=" + (new Date).getTime(),
    paths : {
        "jquery": "vendor/jquery-1.8.2.min",
        "bootstrap": "vendor/bootstrap.min",      
        "underscore": "libs/underscore-min",
        "backbone": "libs/backbone-min",    
        "template": "libs/template",
        "gmaps": "http://maps.google.com/maps/api/js?v=3&sensor=false"
    },
    shim: {
        'backbone': {
            deps: ['jquery', 'underscore'],
            exports: 'Backbone'
        },
        'underscore': {
            exports: '_'
        },
        'bootstrap': {
            deps: ['jquery']
        },
        'gmaps': {
            deps: ['jquery']
        },
        'main':{
            deps: ['jquery','gmaps']   
        }
    }
});

require(["main"], function (main) {})

But inside main.js when I try to instantiate the geocoder i got ,,undefined is not a function" error.

var geocoder = new google.maps.Geocoder();

Any ideas what could I be doing wrong?

解决方案

I've managed to sort it out with the async plugin.

A quick example is:

require.config({
    paths: {
        'async': 'lib/requirejs-plugins/src/async'
    }
});

define(['async!http://maps.google.com/maps/api/js?sensor=false'], function() {
    // Google Maps API and all its dependencies will be loaded here.
});

这篇关于如何使用RequireJS加载Google Maps API？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！