d3.js单击边缘捆绑节点颜色更改单击

Question

我是d3.js的新手，我正在尝试从此链接修改Hierarchical Edge Bundling：https://bl.ocks.org/mbostock/7607999。

我删除了悬停上显示的链接，然后点击点击。我想对我点击的节点（突出显示）做同样的事情。我删除了节点的悬停事件。这是我到目前为止的一个小提琴https://fiddle.jshell.net/vdmn2oj4/。

我该怎么做？

当它悬停时，我们可以在css样式中使用“hover”属性，但是没有点击这样的东西（只有焦点用于链接和文本字段）。

我尝试更改数据并改为使用链接（因此我可以在css中使用焦点）：

 <a href='#' onclick='return true;'>data</a>

但当然没有用（如果你能以某种方式做到这一点，请告诉我）。 并使用类似链接的属性：

.attr({"xlink:href": "#"})

无法正常工作，因为我无法使用css更改其焦点样式（或者我不知道如何，但如果可以的话，这可能会解决我的问题）。

我也尝试过操作节点，但到目前为止，我只能更改所有节点，源和目标，但不能更改我点击的节点。

我也知道节点有一个“父”属性，这可能是我想要的，但我还没有找到如何使用它。

任何解决方案，甚至是部分解决方案都会受到欢迎，因为我已经花了很多时间在这上面。

Answer 1

在function mouseclick：

中添加此内容

d3.select(".node--clicked")
    .classed("node--clicked", false);//removes the class of previously clicked nodes
var clicked = d3.select(this);//select the clicked element
clicked.classed("node--clicked", true);//set the class

这是您更新的小提琴：https://fiddle.jshell.net/vdmn2oj4/3/