0

我正在学习使用 D3.js 来实现我的一些可视化想法，并且我遇到了一些可能很容易而且可能只是一个 javascript 的东西。

我想从另一个函数中调用一个函数。我已经创建了一个基本的散点图，并希望用新的数据点重新加载它。这是JSFiddle。我真的很困惑！

我认为最简单的形式是这样的：

function firstFunction() {
    var something;
}

function secondFunction() {
    firstFunction();
}

但它似乎有时有效，有时无效，也不知道为什么。

4

1 回答 1

1

发生的事情是，在 jsfiddle 中，默认值是将所有内容封装在一个在窗口加载时运行的函数中。代码如下所示：window.onload=function(){your stuff}

当您尝试设置 onload 时，代码结构的结构如下：

function firstFunction(){
    function secondFunction(){
        do stuff
    }
}

onload = secondFunction;

问题是secondFunction在firstFunction. 这称为变量作用域，没有它，编码会很糟糕。

解决此问题的方法是将您的 onload 分配移动到 javascript 块。我建议使用内置的 d3 方法来执行此操作：d3.select('button').on('click',newScatter);在这里我选择按钮并添加一个单击事件处理程序。这是有效的，因为只有一个按钮，但最好给按钮一个 class 或 id 并在d3.select().

如果你这样做，你的代码仍然无法工作，但那是因为你删除了应该包含散点图的 SVG 元素newScatter()（这一行：） elem.parentNode.removeChild(elem);。但是，该按钮将成功执行您告诉它执行的操作并删除您的散点图。

我在这里创建了你的小提琴的工作版本。

于 2013-07-23T14:58:42.133 回答