在 D3.JS 桑基图中突出显示特定的 link

Question

在下面的示例中，我想在初始加载时永久突出显示特定的 link（每个节点之间的连接）：

http://bl.ocks.org/d3noob/c2637e28b79fb3bfea13

如您所见，它会在鼠标悬停时突出显示 link。

这是通过 css 实现的：

.link:hover {
  stroke-opacity: .5;
}

如何在不使用鼠标悬停的情况下（即首次添加 SVG 元素时）为特定 link（例如前两个节点之间的 link）获得相同的结果。

Answer 1

这就是您所需要的：首先，相应地过滤 link 数组。

var firstLink = link.filter(d => d.source.node === 0 && d.target.node === 4);

在那种情况下，我们得到第一个 link（在顶部），它从节点 0（源）到节点 4（目标）。

然后，应用不透明度：

firstLink.attr("opacity", .5);

这是一个 fiddle 显示：https://jsfiddle.net/7mm1ko4f/