in src/sankeyDiagram.ts [1756:1817]
private renderLinks(sankeyDiagramDataView: SankeyDiagramDataView): Selection<SankeyDiagramLink> {
let linksElements: Selection<SankeyDiagramLink> = this.main
.select(SankeyDiagram.LinksSelector.selectorName)
.selectAll(SankeyDiagram.LinkSelector.selectorName);
let linksSelectionData: UpdateSelection<SankeyDiagramLink> =
linksElements
.data(
sankeyDiagramDataView.links.filter((link: SankeyDiagramLink) => {
return link.height > SankeyDiagram.MinSize;
}).sort((a: SankeyDiagramLink, b: SankeyDiagramLink) => {
// sort links to draw forward links in the first, backward links draw as second and selflinks as the last
// in this case self links will be on front side
return a.direction < b.direction ? -1 : a.direction > b.direction ? 1 : 0;
})
);
linksSelectionData
.exit()
.remove();
let linksElementsEnter = linksSelectionData
.enter()
.append("path");
let linksElementsMerged = linksElementsEnter.merge(linksElements);
linksElementsMerged
.classed(SankeyDiagram.LinkSelector.className, true)
.classed(SankeyDiagram.BackwardLinkSelector.className, (link: SankeyDiagramLink) => link.direction === SankeyLinkDirrections.Backward)
.classed(SankeyDiagram.SelftLinkSelector.className, (link: SankeyDiagramLink) => link.direction === SankeyLinkDirrections.SelfLink);
let minHeight = d3.min(sankeyDiagramDataView.links.map(l => l.height));
linksElementsMerged
.attr(
"d", (link: SankeyDiagramLink) => {
if (link.direction === SankeyLinkDirrections.Forward) {
return this.getSvgPathForForwardLink(link);
}
if (link.direction === SankeyLinkDirrections.Backward) {
if (link.source.x + link.source.width > link.destination.x) {
return this.getSvgPathForForwardLink(link);
}
return this.getSvgPathForBackwardLink(link);
}
if (link.direction === SankeyLinkDirrections.SelfLink) {
return this.getSvgPathForSelfLink(link, minHeight);
}
}
)
.attr(
"id", (link: SankeyDiagramLink) => {
return SankeyDiagram.createLink(link);
}
)
.style("stroke", (link: SankeyDiagramLink) => link.strokeColor)
.style("fill", (link: SankeyDiagramLink) => link.fillColor);
return linksElementsMerged;
}