2

我试图让 d3 在单击它们时更改绘图点的颜色，但目前似乎无法使其正常工作。下面的注释行确实将颜色从白色更改为洋红色，但 toggleColor 函数似乎没有做任何事情。实际上，警报仅在第一次运行时发生，而不是在单击某个点时发生。我在这里做错了什么？

var circle = graph.selectAll("circle.value")
    .data（数据）
    .enter().append("圆")
    .attr("类", "值")
    .attr("cx", function(d) { return x(d.hour); })
    .attr("cy", function(d) { return y(d.value); })
    .attr("r", 5)
    //.on("click", function(){d3.select(this).attr("class", "flagged");});
    .on("点击", toggleColor);


var toggleColor = (function(){
    // 发出警报以获得良好的度量。. .
    alert("点击了？")
    var currentColor = "白色";
    返回函数（）{

        currentColor = currentColor == "白色" ? “洋红色”：“白色”；
        d3.select(this).atrr("class", "flaged");
    }
   })();
4

1 回答 1

4

首先，var toggleColor在您连接点击事件的地方仍然未定义（因为它在页面下方进一步定义）。所以你需要向上移动它。

然后，警报在运行时只出现一次的原因是因为那是该代码运行的时候。如果您注意到，外部函数在声明后立即执行，如()代码最后一行的 所示。那是alert()被调用的时候。您需要将它移动到内部函数的主体中——返回的那个——因为该内部函数是在点击时实际运行的代码。

于 2012-06-12T00:57:15.030 回答