Question

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

在此先感谢您真的很想知道答案。

Answer 1

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

相关变化：

1）stroke保存一行的颜色，每个链接都有源/目标节点的信息，要检查它们是否属于同一组，必须进行以下检查：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;
}

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

1 个答案: