Question

我试图在点击时显示/隐藏D3中节点的文本。我尝试使用以下代码：

var node = svg.selectAll(".node")
  .data(json.nodes)
  (...)

node.on("click", function() {
  if (textShowing) {
    node.select("text").style("visibility", "hidden");
  } else {
    node.select("text").style("visibility", "visible");
  }
    textShowing = !textShowing;
 });

代码会导致所有节点的文本属性在点击其中任何一个时显示/消失。

如何影响单击节点的文本属性？

Answer 1

node是一个包含所有群组的选择（我认为它们是群组，因为您没有复制/粘贴整个群组。）

如果您只想在单击的组中执行任何操作，则必须使用d3.select(this)选择它，它会选择当前（在您的情况下，单击的）DOM元素。

因此，而不是：

node.select("text")

应该是：

d3.select(this).select("text")

D3 - 显示/隐藏仅被点击的节点

1 个答案: