javascript - D3 Sankey和弦颜色

因此，我正在使用D3的Sankey API开发Sankey图，并且试图弄清楚如何更改往返于节点的带或线的颜色。我正在尝试做的一个例子可以在这里找到：

http://tamc.github.io/Sankey/

我希望能够单独选择每个乐队并选择该乐队的颜色。我找不到D3的Sankey API的任何文档，所以我不知道如何实现这一目标。我尝试通过在提供的链接中搜索Sankey的代码来找到setColors函数。但是，这似乎不适用于我的代码。我以以下代码为基础开始了Sankey：

http://tamc.github.io/Sankey/examples/simple.html

有人可以告诉我如何以此作为参考来改变乐队的颜色吗？

附言如果有人也可以帮助我解决如何更改节点的颜色，那将是很棒的！

最佳答案

您链接到的示例在Sankey插件之上使用了不同的API。我将解释this example。 Sankey插件不会绘制视觉元素，它只会计算它们的位置，因此您可以随意设置颜色。

示例中链接的相关代码是这样的：

var link = svg.append("g").selectAll(".link")
  .data(energy.links)
  .enter().append("path")
  .attr("class", "link")
  .attr("d", path)
  .style("stroke-width", function(d) { return Math.max(1, d.dy); })
  .sort(function(a, b) { return b.dy - a.dy; });

要更改颜色，只需设置其他类或显式设置stroke即可：

.style("stroke", "red")

当然，这也可以是一项功能，因此您可以为不同的路径设置不同的颜色。节点是相似的：

node.append("rect")
  .attr("height", function(d) { return d.dy; })
  .attr("width", sankey.nodeWidth())
  .style("fill", function(d) { return d.color = color(d.name.replace(/ .*/, "")); })
  .style("stroke", function(d) { return d3.rgb(d.color).darker(2); })

在示例中，填充颜色是根据名称设置的-您可以根据需要进行调整。