在Sankey图中：尽可能缩短路径＆＃34;？

Question

我对使用Sankey图感兴趣，例如http://bost.ocks.org/mike/sankey/

具体来说，我正在使用启用周期的块：http://bl.ocks.org/cfergus/3956043

但是，每个＆＃34; start-node＆＃34;绘制在最左边和每个＆＃34; end-node＆＃34;画在最右边。 Ascii例子：

|A ----> B ----> C ----> D|
|E-------------> C        | <-- starts far left
|F --------------------> D| <-- starts far left
|G ----> B ------------> H| <-- finishes far right

我更喜欢（在我的具体情况下）是保持路径尽可能短，例如：

|A ----> B ----> C ----> D|
|        E-----> C        |  <-- don't start far left
|                F ----> D|  <-- don't start far left
|G ----> B ----> H        |  <-- don't finish far right

任何知道在位置计算算法中是否容易修改的d3js专家？

目前我在渲染节点后手动移动它们。

从：

为：

Answer 1

是的，通过简单的Sankey代码插件更改，可以实现您的目标。

Sankey插件中的函数computeNodeBreadths()中有一行：

moveSinksRight(x);

应该改为：

moveSourcesRight(x);

以下两个例子说明了这一点：

示例1

（原始Sankey插件）

jsfiddle

示例2

（建议更改）

jsfiddle

示例3

（同时包含MoveSinksRight()和MoveSourcesRight()）

jsfiddle

示例4

（没有MoveSinksRight()和MoveSourcesRight()）

jsfiddle

Answer 2

这是我的方法：

http://bl.ocks.org/danharr/af796d91926d254dfe99

我使用graph.links [3] .source.x = 200等明确设置x坐标。这可以链接到数据集而不是硬编码我猜