javascript - 如何在 d3js 中按不同组对链接进行着色

Question

我正在尝试使用 d3 网络，here 中有一个非常有趣的例子。它通过不同的颜色显示不同群体之间的关系。现在我想通过给链接着色来改变它。理想情况下，我希望不同组的链接颜色不同。我可以通过修改该链接中提供的js代码来实现这一点吗？

提前致谢，非常想知道答案。

Answer 1

这个怎么办？ http://bl.ocks.org/maurizzzio/37569cdc0ed9fee40ba3

相关变更:

1) lines 保存一条线的颜色，每个链接都有源/目标节点的信息，为了检查它们是否属于同一组，必须进行以下检查:graphs.nodes[d.source].group === graphs.nodes[d.target].group 但强制布局在调用时正在更改 graphs.links 的结构，我可以使用 d.source.group 和 d.target.group 访问该组，现在如果两个组相同，则线条的笔划与源/目标节点的颜色

2) 如果不是，则链接位于属于不同组的节点之间，将向每个链接添加一个类以应用灰色描边

.attr('stroke', function (d) {
  if (d.source.group === d.target.group) {
    return color(d.source.group);
  } else {
    d3.select(this).classed('different-groups', true);
  }
})

CSS:

.different-groups {
  stroke: #999;
}