3

I'm using D3.js and its sankey plugin to generate sankey charts for my dataset.

Long story short, I've made a few modifications to the plugin source (to get varying branch breadth), and currently have something that looks like:

enter image description here

Now I'm trying to get the branches to curve down (and up), sort of like this image from wikipedia (minus that whole loopback thing):

enter image description here

My question is, is this possible? Well, I know its possible, it's just how big of a rabbit hole it is. I've never used SVG before, and this is my first foray into D3, so I'm not quite sure what I'm getting myself into.

Alternatively, is there another library which will produce a diagram like what I'm going for? I came across this python library which looks like it might do what I want, but I've never written a line of Python, and would rather not (today at least) if I can avoid it.

Zach Lysobey
  • 14,959
  • 20
  • 95
  • 149

1 Answers1

1

Yes, it is possible (and relatively easily feasible) with d3.js.

Here is an example:

http://bl.ocks.org/cfergus/3921009

You will most likely need to adjust the code to suit your need, but this is basically a solution to your problem.

Take a look at this random Sankey generator:

http://bl.ocks.org/cfergus/3956043

After a while you'll get graphs with loops.

VividD
  • 10,456
  • 6
  • 64
  • 111
  • I got really excited when you posted this, but it does not seem like it is doing what I want. This illustrates how the "loopback" work, but as stated in my question, I'm not looking for loops. I'm looking for how to make nodes curve up and out at the ends (point up or down depending on their position relative to the "out" node per the Wiki image). – Zach Lysobey Mar 14 '14 at 17:33
  • On a side note, I was suprised to find that those demos did not work for me on OSX/Chrome. I had to switch to Safari to get them to run – Zach Lysobey Mar 14 '14 at 17:34
  • 1
    The error on Chrome is "Refused to execute script from 'https://raw.github.com/cfergus/d3-plugins/master/sankey/sankey.js' because its MIME type ('text/plain') is not executable, and strict MIME type checking is enabled." For linking to other scripts within github, I think you need to use relative links, not a link to the "raw" file. – AmeliaBR Mar 15 '14 at 00:24