Javascript:从另一个文件调用D3中的函数

时间:2016-05-12 02:03:43

标签: javascript d3.js import include

我想在d3.js脚本中重写与其中一个布局相关的几个函数。当我将这些函数剪切并粘贴到单独的文件中并在d3.js之后加载它们时,可视化不再起作用,因为内部函数调用d3.js的内部函数。

d3.js:

!function() {
  var d3 = { version: "3.5.17" };
  function d3_funct() { return d3; } // this function is called in the other file
}();

chord.js:

d3.svg.chord() = function() {
  var funct = d3_funct; // doesn't work
};

问题:

如果在另一个文件中立即执行的函数表达式中定义d3_funct,我将如何在我的脚本chord.js中使用上述函数d3_funct

选项:

  1. 直接编辑d3.js文件,而不是拉出要重写的函数:(
  2. 重命名封闭的d3函数并使用jQuery将其加载到chord.js。
  3. 我错过了什么吗?

1 个答案:

答案 0 :(得分:1)

因此,您的执行顺序应为:

  1. 加载d3.js
  2. 加载自定义修改
  3. 加载其余代码
  4. 您的修改文件应如下所示:

    function myBetterD3Funct () { ... }
    d3.d3_funct = myBetterD3Funct;
    

    以上是迄今为止最好的选择。非常清楚您正在做什么,并且每次下载最新版本时都不需要您修改d3.js文件(因此允许您使用d3 cdn为您的用户提供d3.js)。

    如果您不想覆盖d3全局函数本身,则存在另一个选项。我警告您,以下内容可能不适用于所有情况,具体取决于您myBetterD3Funct的复杂程度以及d3内的访问权限。

    function myBetterD3Funct () { ... }
    myBetterD3Funct.apply(d3);
    

    这样做是将函数的范围(在运行时)设置为全局d3对象。这将允许它使用d3引用全局this对象中的顶级属性。如下面的评论中所述,代码中的许多函数和变量都是written to be private,因此您无法以任何方式访问它们(除了修改源代码外)。