Sankey subplot in grid layout

plotly.js
1

Hi there, i’m new in the ‘plotly.js’ world and i was dealing with the sankey diagram.

I’d like to do a subplots of 2 different sankeys and i read in the official documentation that in every sankey data domain declaration i can define the column it belongs (as long as there is a grid-layout defined).

In the following snippet i defined everything exactly as i understood it must be done, but no grid-layout has be defined on my plot.

var data1 = {
	column: 1,
	type: "sankey",
	orientation: "h",
	node: {
		line: {
			color: "black"
		},
		label: ["el1", "el2", "el3"]
	},
	link: {
		source : [0, 2],
		target : [1, 1],
		value  : [120, 50],
		label  : ["stram1", "stream2"]
	}
};

var data2 = {
	column: 2,
	type: "sankey",
	orientation: "h",
	node: {
		line: {
			color: "black"
		},
		label: ["el4", "el5", "el6"]
	},
	link: {
		source : [0, 2],
		target : [1, 1],
		value  : [120, 50],
		label  : ["stram4", "stream5"]
	}
};

var data = [data1, data2];

var layout = {
	title: "Title goes here",
	autosize : true,
	showlegend : false,
	grid : {
		columns : 2
	}
};

Plotly.react('plotly-div', data, layout);

Is there any way to do this kind of multi sankeys subplot?

Thanks in advance,
Andrea.

2

Here’s how: https://codepen.io/etpinard/pen/mjzdjx?editors=1010

In brief,

  • you need to specify both layout.grid.columns and layout.grid.rows to generate a grid
  • you need to set the columns index for each trace in domain.column (not just .column like you had)
  • You can try using Plotly.validate to help you out

Now, resulting domain for the second sankey trace is off unfortunately. This seems like a bug.

3

Thanks a lot for your quick answer.
I am sorry it doesn’t work properly and I hope it is going to be fixed in the next release.

4

you can subscribe to https://github.com/plotly/plotly.js/issues/2878 for the most up-to-date development info.

1 Like
5

Thanks a lot.
I definitely will.

Andrea.