【问题标题】:Javascript: calling function within D3 from another fileJavascript:从另一个文件调用 D3 中的函数
【发布时间】:2016-09-07 15:30:58
【问题描述】:

我想在 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 中。

我错过了什么吗?

【问题讨论】:

    标签: javascript d3.js import include


    【解决方案1】:

    所以,你的执行顺序应该是:

    1. 加载 d3.js
    2. 加载您的自定义修改
    3. 加载其余代码

    您的修改文件应如下所示:

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

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

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

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

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

    【讨论】:

    • "这将允许它使用 this 引用全局 d3 对象中的任何内容。" - 不是一切:事实上,你不能访问局部变量(这是 OP 试图访问的)。 OP,d3 代码是故意以这种方式编写的,因此您无法访问它:这是 JavaScript 私有值模式。
    • D3 v4.0 已被分解为“模块”。您认为这可能更适合 OP 吗?
    • @Amadan 他应该能够访问顶层的局部变量(那些直接在 d3 对象上的变量)。但是,是的,没有办法进入封闭的函数——我会通过更新来解决这个问题。
    • @GerardoFurtado 可能会也可能不会。我不熟悉新结构,但这取决于它的组织方式以及 OP 需要访问的确切内容。
    • "那些直接在d3 级别的" - 这些不是局部变量。 d3.foo 是一个属性,可以从外部访问。 var foo(或function foo())是一个局部变量,不能从外部访问。你的上下文是什么并不重要 - 你的技巧只是意味着你可以访问 d3.foothis.foo
    猜你喜欢
    • 1970-01-01
    • 2019-01-16
    • 1970-01-01
    • 2017-11-28
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多