0

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

在此处输入图像描述

我已经删除了在hover上显示的链接，并改为点击。我想对我点击的节点做同样的事情（突出显示它）。我已经删除了节点的悬停事件。这是我迄今为止所拥有的小提琴https://fiddle.jshell.net/vdmn2oj4/。

我怎样才能做到这一点？

当它处于悬停状态时，我们可以只使用 css 样式中的“悬停”属性，但是单击时没有这样的事情（仅针对链接和文本字段的焦点）。

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

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

但当然这不起作用（如果你能以某种方式做到这一点，请告诉我）。并为链接使用属性，如下所示：

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

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

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

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

任何解决方案，即使是部分解决方案都将受到欢迎，因为我已经在这方面花费了很多时间。

4

1 回答 1

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/

于 2016-06-29T14:36:31.617 回答