Highchart sankey - Make node have a higher weight than total out going

Mia214 0
Viewed 39

I'm trying to use highcharts to render a sankey chart like this.

In here, the first node has a higher "value" compared to its outgoing link. Is there a way to achieve this? I've gone through the highchart's sankey APIs but can't find anything which would allow me to set a node's height larger than its outgoing link.

I've created this JsFiddle as a starting point. You can see that the "Step 1" and "Step 2" nodes have a 1:1 height but I want the first node to be larger 75 and only have an outgoing link to "Step 2" of value 50

Any pointers on how to achieve this?

sankey-diagram highcharts javascript
1 Answers

Inside events.load it's possible for series like Sankey to hide nodes and links, with update options update and change graphic attributes.

  chart: {
    events: {
      load: function() {
        let chart = this,
          series = chart.series[0],
          nodes = series.nodeLookup,
          columns = series.nodeColumns;

        for (let i in nodes) {
          if (nodes[i].id === "step0") {
            nodes[i].update({
              color: 'transparent'
            });
            nodes[i].graphic.hide();
            nodes[i].dataLabel.hide();
            nodes[i].visible = false;
            nodes[i].linksFrom[0].graphic.hide();
          }
        }
      }
    }
  },

Live demo: https://jsfiddle.net/BlackLabel/342pvzfj/1/

---- EDIT

To adjust the chart edge and chart plot area try chart.marginLeft gives way to move the chart to the left.

marginLeft: -100,
Sebastian Hajdus0
Related