diff --git a/README.md b/README.md index c4eb3da..6b9c8d6 100644 --- a/README.md +++ b/README.md @@ -29,12 +29,13 @@ Computes the node and link positions for the given *arguments*, returning a *gra * *graph*.nodes - the array of [nodes](#sankey_nodes) * *graph*.links - the array of [links](#sankey_links) -# sankey.update(graph) +# sankey.update(graph) Recomputes the specified *graph*’s links’ positions, updating the following properties of each *link*: * *link*.y0 - the link’s vertical starting position (at source node) * *link*.y1 - the link’s vertical end position (at target node) +* *link*.circularLinkType - the link's circularLinkType either *top* or *bottom*, depending on whether the center of the connected nodes is above or below the vertical midpoint of the figure. This method is intended to be called after computing the initial [Sankey layout](#_sankey), for example when the diagram is repositioned interactively. diff --git a/dist/d3-sankey-circular.js b/dist/d3-sankey-circular.js index fcae95b..d3e5630 100644 --- a/dist/d3-sankey-circular.js +++ b/dist/d3-sankey-circular.js @@ -255,16 +255,6 @@ // - x0, x1: the x coordinates, as is relates to visual position from left to right // computeNodeDepths(graph) - // Force position of circular link type based on position - graph.links.forEach(function (link) { - if (link.circular) { - link.circularLinkType = link.y0 + link.y1 < y1 ? 'top' : 'bottom'; - - link.source.circularLinkType = link.circularLinkType; - link.target.circularLinkType = link.circularLinkType; - } - }); - // 3. Determine how the circular links will be drawn, // either travelling back above the main chart ("top") // or below the main chart ("bottom") @@ -275,6 +265,16 @@ // computeNodeBreadths(graph, iterations, id) computeLinkBreadths(graph); + // Force position of circular link type based on position + graph.links.forEach(function (link) { + if (link.circular) { + link.circularLinkType = link.y0 + link.y1 < y1 ? 'top' : 'bottom'; + + link.source.circularLinkType = link.circularLinkType; + link.target.circularLinkType = link.circularLinkType; + } + }); + sortSourceLinks(graph, y1, id, false); // Sort links but do not move nodes sortTargetLinks(graph, y1, id); diff --git a/dist/d3-sankey-circular.mjs b/dist/d3-sankey-circular.mjs index 8fddfda..17ea8d0 100644 --- a/dist/d3-sankey-circular.mjs +++ b/dist/d3-sankey-circular.mjs @@ -253,16 +253,6 @@ function sankeyCircular () { // - x0, x1: the x coordinates, as is relates to visual position from left to right // computeNodeDepths(graph) - // Force position of circular link type based on position - graph.links.forEach(function (link) { - if (link.circular) { - link.circularLinkType = link.y0 + link.y1 < y1 ? 'top' : 'bottom'; - - link.source.circularLinkType = link.circularLinkType; - link.target.circularLinkType = link.circularLinkType; - } - }); - // 3. Determine how the circular links will be drawn, // either travelling back above the main chart ("top") // or below the main chart ("bottom") @@ -273,6 +263,16 @@ function sankeyCircular () { // computeNodeBreadths(graph, iterations, id) computeLinkBreadths(graph); + // Force position of circular link type based on position + graph.links.forEach(function (link) { + if (link.circular) { + link.circularLinkType = link.y0 + link.y1 < y1 ? 'top' : 'bottom'; + + link.source.circularLinkType = link.circularLinkType; + link.target.circularLinkType = link.circularLinkType; + } + }); + sortSourceLinks(graph, y1, id, false); // Sort links but do not move nodes sortTargetLinks(graph, y1, id); diff --git a/src/sankeyCircular.js b/src/sankeyCircular.js index 2cd4350..eeecf55 100644 --- a/src/sankeyCircular.js +++ b/src/sankeyCircular.js @@ -232,6 +232,16 @@ import {linkHorizontal} from "d3-shape"; // - x0, x1: the x coordinates, as is relates to visual position from left to right // computeNodeDepths(graph) + // 3. Determine how the circular links will be drawn, + // either travelling back above the main chart ("top") + // or below the main chart ("bottom") + selectCircularLinkTypes(graph, id) + + // 6. Calculate the nodes' and links' vertical position within their respective column + // Also readjusts sankeyCircular size if circular links are needed, and node x's + // computeNodeBreadths(graph, iterations, id) + computeLinkBreadths(graph) + // Force position of circular link type based on position graph.links.forEach(function (link) { if (link.circular) { @@ -244,19 +254,9 @@ import {linkHorizontal} from "d3-shape"; } }) - // 3. Determine how the circular links will be drawn, - // either travelling back above the main chart ("top") - // or below the main chart ("bottom") - selectCircularLinkTypes(graph, id) - - // 6. Calculate the nodes' and links' vertical position within their respective column - // Also readjusts sankeyCircular size if circular links are needed, and node x's - // computeNodeBreadths(graph, iterations, id) - computeLinkBreadths(graph) - sortSourceLinks(graph, y1, id, false) // Sort links but do not move nodes sortTargetLinks(graph, y1, id) - + // 7. Sort links per node, based on the links' source/target nodes' breadths // 8. Adjust nodes that overlap links that span 2+ columns // var linkSortingIterations = 4; //Possibly let user control this number, like the iterations over node placement