Giter Site home page Giter Site logo

Comments (30)

cfergus avatar cfergus commented on June 9, 2024 1

Alright, round two.
http://bl.ocks.org/3956043
Points of note:

  • (improvement) The viewbox is expanded to fit potential cycles at the left and right. This could be made better by only expanding when such cycles exist.
  • The equivalence is based on nodes now, so your example with nodes identically named should work out now
  • The gist example above uses randomly generated sankey data. As such, you don't know what you'll get
  • The bl.ocks view seems to have its own css, so you may just want to use the "Open in a new window" link to see it more fully.
  • (bug) This code doesn't seem to handle 'self-cycles', where a node loops back onto itself.

Let me know if this seems usable!

from d3-plugins.

mbostock avatar mbostock commented on June 9, 2024 1

@prakashsd You can do this by having multiple nodes that represent A & B at different times (A1, B1, A2, B2). Such a diagram is sometimes called an “alluvial diagram”. If you have further questions, please ask on Stack Overflow or the D3.js Slack; these issues are for bug reports and active feature development.

from d3-plugins.

mbostock avatar mbostock commented on June 9, 2024

I'd love to see this implemented. The strategy I'd try first is to ignore links that generate cycles in the initial layout, and then add them back in again to draw the loops.

from d3-plugins.

bhaugen avatar bhaugen commented on June 9, 2024

I'm on it. Any pointers to where I should focus in the code? When I halted it a few times, it was cycling through computeNodeBreadths(), but maybe that was a red herring...

from d3-plugins.

mbostock avatar mbostock commented on June 9, 2024

Right, computeNodeBreadths is where you'll get an infinite loop unless you detect cycles. So that's the first thing (where you ignore links that generate cycles). The second thing is we probably need to handle loopback links and render them differently. Loopback links still exit the right side, but then they need to loopback to the source and enter on the left side. Probably the sankey.link implementation needs to special-case loopback links and generate a different path for them.

from d3-plugins.

bhaugen avatar bhaugen commented on June 9, 2024

Thanks for the continued conversation.

What I did for the short term (because I got users waiting for sankeys, and their networks are acyclic) is cheat. I already got code to detect cycles in python (where I'm assembling the data for the sankeys), so I just disabled the sankeys if your network has a cycle.

Then I gotta get my head back on straight within computeNodeBreadths, which currently makes it spin. Then figure out how detect and postpone cyclic links there.

I suspect the loopback links are gonna be beyond my skill level, but we'll see.

from d3-plugins.

cfergus avatar cfergus commented on June 9, 2024

I've made an attempt at solving this issue. There are a few ways it could be improved, but please let me know if a pull request (or otherwise) is in order.

Example at : http://bl.ocks.org/3921009

Fork and changes at:
cfergus/d3-plugins@deb7bda

from d3-plugins.

bhaugen avatar bhaugen commented on June 9, 2024

Thanks, but those changes did not work for me. Created false cycles in networks that did not have cycles, and did not handle simple cycles very well.

Here's a network that has no cycles, before:
http://locecon.org/clusters/sankey/16/

Here it is after:
https://docs.google.com/open?id=0BxlqOeaPnXHfSTloOWVWQTdFVkk

Here's one with a cycle, using your changes:
https://docs.google.com/open?id=0BxlqOeaPnXHfSGpXbVFPVkFCZjQ

Here's the page source:
https://docs.google.com/open?id=0BxlqOeaPnXHfRmtmU2UwTzFsOFE

Let me know if you think I did not use your changed code correctly - or if you can't access those files.

from d3-plugins.

cfergus avatar cfergus commented on June 9, 2024

Regarding the first network featuring "Groundfish":
My code, at present, checks if the node names are the same, as opposed to node object equality. It appears that your code uses multiple nodes with the same name (specifically, "Groundfish", for example), which my code doesn't account for (my bad).
I'll try switching to object equality, and see if that makes things better.

Regarding the second network, featuring "Restaurant -> Compost Materials":
The cycle is present, but my layout is not good. You can see the cycle being rendered (in part) at the top of the screen. This is because the "Restaurant" node is flush with the far right of the viewbox (where the path starts), and "Compost Materials" node is flush with the far left (where the path ends).
I will need to update the overall algorithm for laying out the entire sankey diagram, as well as the feedback loops, in order to make this display as one might expect. This part might take a bit longer. Open to suggestions.

from d3-plugins.

bhaugen avatar bhaugen commented on June 9, 2024

My code, at present, checks if the node names are the same, as opposed to node object equality.
It appears that your code uses multiple nodes with the same name (specifically, "Groundfish", for example),
which my code doesn't account for (my bad).
I'll try switching to object equality, and see if that makes things better.

I understand the problem. My code actually assembles the link relationships on the server, so you can't see from the page source how it's done (looking up the array indices based on object identity). I've meant to work up a rev for sankeys to assemble the links based on node object ids rather than array indices in the sankey javascript, but haven't had time. That would at least make explicit what is happening.

So if providing unique node ids would help what you are trying to do, I can easily provide them.

The duplicate names were a given (to me: they were created by users), and they do actually make sense on some level...

from d3-plugins.

bhaugen avatar bhaugen commented on June 9, 2024

cfergus, thanks for persisting. It's better; does not falsely detect cycles when nodes have the same names. My networks with cycles look a little odd, but it also looks like I will have to change my code to take advantage of your cycle features. I'm in crunch mode on another project, but will try that when I get a chance.

from d3-plugins.

kunalb avatar kunalb commented on June 9, 2024

Hi -- i just sent a pull request that might help (#39) with this.

from d3-plugins.

angiehjort avatar angiehjort commented on June 9, 2024

hi all! so was the issue actually solved? is there a demo showing it? yes, works perfect!

however http://bl.ocks.org/3956043 is broken
because GIThub does not allow to fetch .js with raw. prefix anymore.
@cfergus, please consider changing a link to sankey.js

image

thanks!

from d3-plugins.

vlasvlasvlas avatar vlasvlasvlas commented on June 9, 2024

are cycles now implemented?

from d3-plugins.

angiehjort avatar angiehjort commented on June 9, 2024

yes, they are, as i could see yesterday
save the code from http://bl.ocks.org/3956043 and the referred sankey.js locally, change the link to sankey.js and run the code. it should work:

image

from d3-plugins.

cfergus avatar cfergus commented on June 9, 2024

My bad. I updated my gist to include the modified sankey.js alongside it. The link should work now for http://bl.ocks.org/3956043

from d3-plugins.

bhaugen avatar bhaugen commented on June 9, 2024

Yes! Works now. Thank you, Colin.

On Thu, Jul 17, 2014 at 3:19 PM, Colin Fergus [email protected]
wrote:

My bad. I updated my gist to include the modified sankey.js alongside it.
The link should work now for http://bl.ocks.org/3956043


Reply to this email directly or view it on GitHub
#1 (comment).

from d3-plugins.

gnewton avatar gnewton commented on June 9, 2024

Any chance we can have the lanes going back in the loop (at the top of http://bl.ocks.org/3956043 ) to retain their width? Or to have it toggle-able to retain width or all squeeze down to the same width, as it is now?
I find altering the width makes the interpretation more difficult, i.e. if you can see the width of the loop-backs this givers you the impression of their significance. Perhaps better stated, reducing their width (even though their starts and ends flair out to the right width, kind of reduces their visual impact more than I think is best for this kind of visualization...
That said, great work! :-)

from d3-plugins.

Erfabes avatar Erfabes commented on June 9, 2024

Hi! i´m Just wondering if its is possible to get these cycle-lanes to the bottom of the diagramm?

from d3-plugins.

prufrock avatar prufrock commented on June 9, 2024

Would it be possible to commit the changes proposed here?

from d3-plugins.

vlasvlasvlas avatar vlasvlasvlas commented on June 9, 2024

nicee

from d3-plugins.

fordanic avatar fordanic commented on June 9, 2024

Try to use it for cycles for a single node, i.e. the node is pointing back to itself. Is there a reason why it doesn't work or is it just me?

from d3-plugins.

soxofaan avatar soxofaan commented on June 9, 2024

Hi all, I did another implementation of this:
soxofaan/d3-plugins@be35a11

It's simpler/less code compared to the solution of @cfergus, but I think the cycle detection it is more efficient.
I also preserve the width of the feedback lanes (as requested above).
The feedback paths layout might need some more tuning, but I thought to already push the current state and collect some feedback

examples at http://bl.ocks.org/soxofaan/bb6f91d57dc4b6afe91d/cc526b481b1bc59982e9fe511fd97d776da20b95 (don't forget to refresh

from d3-plugins.

bhaugen avatar bhaugen commented on June 9, 2024

Those are some nice-looking cycles.

On Mon, May 18, 2015 at 7:37 PM, Stefaan Lippens [email protected]
wrote:

Hi all, I did another implementation of this:
soxofaan/d3-plugins@be35a11
soxofaan@be35a11

It's simpler/less code compared to the solution of @cfergus
https://github.com/cfergus, but I think the cycle detection it is more
efficient.
I also preserve the width of the feedback lanes (as requested above).
The feedback paths layout might need some more tuning, but I thought to
already push the current state and collect some feedback

examples at
http://bl.ocks.org/soxofaan/bb6f91d57dc4b6afe91d/cc526b481b1bc59982e9fe511fd97d776da20b95
(don't forget to refresh


Reply to this email directly or view it on GitHub
#1 (comment).

from d3-plugins.

cfergus avatar cfergus commented on June 9, 2024

So far, looks better than my implementation. I dunno what the etiquette would be, but I consider mine to be 'overtaken'. Should I include a link to your version in my readme? Other preferred way to reflect this?

from d3-plugins.

bhaugen avatar bhaugen commented on June 9, 2024

But, Colin, thanks for being the pioneer!

On Tue, May 19, 2015 at 9:14 AM, Colin Fergus [email protected]
wrote:

So far, looks better than my implementation. I dunno what the etiquette
would be, but I consider mine to be 'overtaken'. Should I include a link to
your version in my readme? Other preferred way to reflect this?


Reply to this email directly or view it on GitHub
#1 (comment).

from d3-plugins.

soxofaan avatar soxofaan commented on June 9, 2024

FYI: I started a friendly (subtree) fork (see #133) of the sankey plugin at https://github.com/soxofaan/d3-plugin-captain-sankey

among others I tweaked the cycle support some more:

screen shot 2015-05-29 at 02 09 49

from d3-plugins.

NickCiao avatar NickCiao commented on June 9, 2024

Walking through computeLinkDepths to try and diagnose what's going on. Would love to know if you guys have any insights on what might be happening:

image

edit turns out this is an issue with the data, not the vis itself.

from d3-plugins.

someshku avatar someshku commented on June 9, 2024

Hi Stefaan, in my project we have just too many cycles making the chart difficult to comprehend. How can I move the cycle paths back to the top like Colin's while keeping your core code.

from d3-plugins.

prakashsd avatar prakashsd commented on June 9, 2024

Folks,
Is it possible to create a chart like the one attached using sankey diagram?

  1. Cyclic Representation
    A -> B
    B -> A

  2. Same nodes in Source and Destination
    A A
    B B
    C C

  3. I want to color code each bands to differentiate the categories.

Basically, I want to show how many sessions were steered/switched from one network to the other.

TIA!

sankey

from d3-plugins.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.