使用dojo使用amd加载d3

Question

嗨我在amd模式中使用dojo作为我的主应用程序(html页面).我想创建一个引用d3库来创建一些图表的模块.我在创建这个模块时遇到了麻烦 - 到目前为止,模块(javascript文件)到目前为止是这样的:

define(["d3"], function (d3) {
    return {
        setd3ChartData: function () {
            //this function can be called from my main app
             //but d3 isnt linked to the d3 js library
        }
    }
});

在我的主应用程序中,我在脚本标记中有一个指向d3库的链接

如何将此脚本链接到模块中？我可以从主应用程序访问d3库

谢谢

皮特

Answer 1

当您想将D3与Dojo一起使用时,您可能首先要在Dojo配置中定义D3包.例如(使用CDN时)​​:

<script type="text/javascript">
    var dojoConfig = {
        async: true,
        parseOnLoad: true,
        packages: [{
            name: "d3",
            location: "http://cdnjs.cloudflare.com/ajax/libs/d3/3.4.6/"
        }]
    }
</script>

然后你可以使用D3:

require([ "d3/d3" ], function(d3) {
    // Do stuff with "d3"
});

您必须使用的原因"d3/d3"不仅仅是指示包名称"d3"之前的部分/,在这种情况下它是d3(我们使用配置dojoConfig).

第二部分是实际的文件,或者在这种情况下d3.js.

我还制作了一个JSFiddle来展示使用AMD加载器加载D3的工作示例.在该示例中,我将Dojo配置放在Fiddle选项下,但设置是相同的.

我还将回调重命名为d3Lib,因为D3默认创建d3全局变量,现在您可以清楚地看到它与AMD一起工作.

如果要使用缩小版本,可以加载"d3/d3.min".