4

I am interested in using Sankey diagrams, like http://bost.ocks.org/mike/sankey/

Specifically, I am using the block that enables cycles: http://bl.ocks.org/cfergus/3956043

But, each "start-node" is drawn on the far left and each "end-node" drawn on the far right. Ascii example:

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

What I prefer (in my specific case) is to keep the paths as short as possible, e.g.:

|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

Any d3js experts that know if this is easy to modify in the position calculation algorithm?

At the moment I manually move the nodes after they have been rendered.

from:

original behavior

to:

desired behavior

VividD
  • 10,456
  • 6
  • 64
  • 111
wivku
  • 2,457
  • 2
  • 33
  • 42

2 Answers2

3

Yes, it is possible to achieve what you want, with a simple change in Sankey code plugin.

There is a line in function computeNodeBreadths() within Sankey plugin:

moveSinksRight(x);

It should be changed to:

moveSourcesRight(x);

This is illustrated in following two examples:

Example 1

(original Sankey plugin)

jsfiddle

enter image description here

Example 2

(with proposed change)

jsfiddle

enter image description here

Example 3

(with both MoveSinksRight() and MoveSourcesRight())

jsfiddle

enter image description here

Example 4

(without both MoveSinksRight() and MoveSourcesRight())

jsfiddle

enter image description here

VividD
  • 10,456
  • 6
  • 64
  • 111
  • Excellent, exactly what I was looking for. Thanks! It seems you used the same jsfiddle for example 2 and 3? – wivku Dec 19 '14 at 18:02
0

This is my approach:

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

I'm explicitly setting the x co-ordinates using graph.links[3].source.x = 200 etc. This could be linked to a dataset rather than being hard coded I guess

Dan Harrington
  • 763
  • 2
  • 6
  • 7
  • Your response is appreciated, but I'm looking for what to change in the algorithm, not how to hardcode the coordinates. – wivku Nov 01 '14 at 18:22