score:1

Accepted answer

One solution would be to make a timeout function like this:

  setTimeout(function() {
    //does the relayout
    biHiSankey.relayout();
    //update all the nodes with new height
    svg.selectAll(".node").selectAll("rect").attr("height", 
     function (d) { 
        return d.height; 
    });
    //update all the path
    link.attr("d", path);
  }, TRANSITION_DURATION +450);

Inside the update function.

This will get triggered after the transition is complete.

working code here

score:0

If I'm right it's because the order of the data in your array does not match the order of their position. The array-order seems to determine in which order the dependencies are shown, unless you reposition any of the elements, which results in a rerendering.

I've tried reordering some elements of the data array, to follow the positions on the chart, and their size and the dependency-links between them automatically rendered fine.

I also noticed, that some elements, though listed in the array, do not get displayed in the chart, as they do not have any dependencies added.


Related Query