Paths are being generated outside of the svg box size

[kevinmamaqi]

The same sankey component works well with the first dataset, but the paths are getting outside of the svg box in the second, any idea why is that happening?:

VISUAL:

DATASET:

export default {
	nodes: [
		{
			name: "URGENCIAS NOCOVID",
			color: "#f77d0a",
		},
		{
			name: "URGENCIAS COVID",
			color: "#ba5d06",
		},
		{
			name: "UCI NOCOVID",
			color: "#9d4edd",
		},
		{
			name: "UCI COVID",
			color: "#7824bc",
		},
		{
			name: "PISO NOCOVID",
			color: "#00b4d8",
		},
		{
			name: "PISO COVID",
			color: "#0086a2",
		},
		{
			name: "Muertes",
			color: "black",
		},
		{
			name: "EGRESOS",
			color: "#6a994e",
		},
	],
	links: [
		{
			source: "URGENCIAS COVID",
			target: "EGRESOS",
			value: 0.276785714,
		},
		{
			source: "UCI COVID",
			target: "EGRESOS",
			value: 0.008438819,
		},
		{
			source: "PISO COVID",
			target: "EGRESOS",
			value: 0.67223382,
		},
		{
			source: "URGENCIAS NOCOVID",
			target: "EGRESOS",
			value: 0.830161357,
		},
		{
			source: "UCI NOCOVID",
			target: "EGRESOS",
			value: 0.123076923,
		},
		{
			source: "PISO NOCOVID",
			target: "EGRESOS",
			value: 0.450643777,
		},
		{
			source: "URGENCIAS COVID",
			target: "Muertes",
			value: 0.017857143,
		},
		{
			source: "UCI COVID",
			target: "Muertes",
			value: 0.278481013,
		},
		{
			source: "PISO COVID",
			target: "Muertes",
			value: 0.059846903,
		},
		{
			source: "URGENCIAS NOCOVID",
			target: "Muertes",
			value: 0.003516756,
		},
		{
			source: "UCI NOCOVID",
			target: "Muertes",
			value: 0.097435897,
		},
		{
			source: "PISO NOCOVID",
			target: "Muertes",
			value: 0.028816677,
		},
		{
			source: "URGENCIAS NOCOVID",
			target: "URGENCIAS COVID",
			value: 0.016342573,
		},
		{
			source: "PISO NOCOVID",
			target: "URGENCIAS COVID",
			value: 0.042305334,
		},
		{
			source: "URGENCIAS COVID",
			target: "UCI COVID",
			value: 0.022321429,
		},
		{
			source: "PISO COVID",
			target: "UCI COVID",
			value: 0.091858038,
		},
		{
			source: "URGENCIAS NOCOVID",
			target: "UCI COVID",
			value: 0.005999173,
		},
		{
			source: "UCI NOCOVID",
			target: "UCI COVID",
			value: 0.046153846,
		},
		{
			source: "PISO NOCOVID",
			target: "UCI COVID",
			value: 0.083997548,
		},
		{
			source: "URGENCIAS COVID",
			target: "PISO COVID",
			value: 0.401785714,
		},
		{
			source: "UCI COVID",
			target: "PISO COVID",
			value: 0.556962025,
		},
		{
			source: "URGENCIAS NOCOVID",
			target: "PISO COVID",
			value: 0.075920563,
		},
		{
			source: "UCI NOCOVID",
			target: "PISO COVID",
			value: 0.123076923,
		},
		{
			source: "PISO NOCOVID",
			target: "PISO COVID",
			value: 0.251379522,
		},
		{
			source: "URGENCIAS COVID",
			target: "URGENCIAS NOCOVID",
			value: 0.080357143,
		},
		{
			source: "PISO NOCOVID",
			target: "URGENCIAS NOCOVID",
			value: 0.096259963,
		},
		{
			source: "URGENCIAS COVID",
			target: "UCI NOCOVID",
			value: 0.004464286,
		},
		{
			source: "UCI COVID",
			target: "UCI NOCOVID",
			value: 0.042194093,
		},
		{
			source: "PISO COVID",
			target: "UCI NOCOVID",
			value: 0.016701461,
		},
		{
			source: "URGENCIAS NOCOVID",
			target: "UCI NOCOVID",
			value: 0.005378568,
		},
		{
			source: "PISO NOCOVID",
			target: "UCI NOCOVID",
			value: 0.045370938,
		},
		{
			source: "URGENCIAS COVID",
			target: "PISO NOCOVID",
			value: 0.1875,
		},
		{
			source: "UCI COVID",
			target: "PISO NOCOVID",
			value: 0.099156118,
		},
		{
			source: "PISO COVID",
			target: "PISO NOCOVID",
			value: 0.153792624,
		},
		{
			source: "URGENCIAS NOCOVID",
			target: "PISO NOCOVID",
			value: 0.062474141,
		},
		{
			source: "UCI NOCOVID",
			target: "PISO NOCOVID",
			value: 0.61025641,
		},
	],
};

VISUAL OUTSIDE:

DATASET:

export default {
	nodes: [
		{ name: "ER_ADULT_NOCOVID", color: "#f77d0a" },
		{ name: "Alta Hospitalaria", color: "#6a994e" },
		{ name: "ER_ADULT_COVID", color: "#ba5d06" },
		{ name: "WARD_ADULT_COVID", color: "#0086a2" },
		{ name: "WARD_ADULT_NOCOVID", color: "#00b4d8" },
		{ name: "ICU_ADULT_COVID", color: "#7824bc" },
		{ name: "ICU_ADULT_NOCOVID", color: "#9d4edd" },
		{ name: "Fallecimiento", color: "black" },
	],
	links: [
		{
			source: "ER_ADULT_NOCOVID",
			target: "Alta Hospitalaria",
			value: 0.8316888045540797,
		},
		{
			source: "ER_ADULT_COVID",
			target: "Alta Hospitalaria",
			value: 0.29004329004329,
		},
		{
			source: "WARD_ADULT_COVID",
			target: "Alta Hospitalaria",
			value: 0.6789473684210526,
		},
		{
			source: "WARD_ADULT_NOCOVID",
			target: "Alta Hospitalaria",
			value: 0.448512585812357,
		},
		{
			source: "ICU_ADULT_COVID",
			target: "Alta Hospitalaria",
			value: 0.01195219123505976,
		},
		{
			source: "ICU_ADULT_NOCOVID",
			target: "Alta Hospitalaria",
			value: 0.1213592233009709,
		},
		{
			source: "ER_ADULT_NOCOVID",
			target: "Fallecimiento",
			value: 0.003795066413662239,
		},
		{
			source: "ER_ADULT_COVID",
			target: "Fallecimiento",
			value: 0.01731601731601732,
		},
		{
			source: "WARD_ADULT_COVID",
			target: "Fallecimiento",
			value: 0.05723684210526316,
		},
		{
			source: "WARD_ADULT_NOCOVID",
			target: "Fallecimiento",
			value: 0.02803203661327231,
		},
		{
			source: "ICU_ADULT_COVID",
			target: "Fallecimiento",
			value: 0.2768924302788844,
		},
		{
			source: "ICU_ADULT_NOCOVID",
			target: "Fallecimiento",
			value: 0.0970873786407767,
		},
		{
			source: "ER_ADULT_COVID",
			target: "ER_ADULT_NOCOVID",
			value: 0.07792207792207792,
		},
		{
			source: "WARD_ADULT_NOCOVID",
			target: "ER_ADULT_NOCOVID",
			value: 0.1081235697940503,
		},
		{
			source: "ER_ADULT_NOCOVID",
			target: "ER_ADULT_COVID",
			value: 0.01555977229601518,
		},
		{
			source: "WARD_ADULT_NOCOVID",
			target: "ER_ADULT_COVID",
			value: 0.04176201372997711,
		},
		{
			source: "ER_ADULT_NOCOVID",
			target: "WARD_ADULT_COVID",
			value: 0.07666034155597723,
		},
		{
			source: "ER_ADULT_COVID",
			target: "WARD_ADULT_COVID",
			value: 0.3939393939393939,
		},
		{
			source: "WARD_ADULT_NOCOVID",
			target: "WARD_ADULT_COVID",
			value: 0.2448512585812357,
		},
		{
			source: "ICU_ADULT_COVID",
			target: "WARD_ADULT_COVID",
			value: 0.5557768924302788,
		},
		{
			source: "ICU_ADULT_NOCOVID",
			target: "WARD_ADULT_COVID",
			value: 0.116504854368932,
		},
		{
			source: "ER_ADULT_NOCOVID",
			target: "WARD_ADULT_NOCOVID",
			value: 0.06110056925996205,
		},
		{
			source: "ER_ADULT_COVID",
			target: "WARD_ADULT_NOCOVID",
			value: 0.1861471861471861,
		},
		{
			source: "WARD_ADULT_COVID",
			target: "WARD_ADULT_NOCOVID",
			value: 0.1467105263157895,
		},
		{
			source: "ICU_ADULT_COVID",
			target: "WARD_ADULT_NOCOVID",
			value: 0.099601593625498,
		},
		{
			source: "ICU_ADULT_NOCOVID",
			target: "WARD_ADULT_NOCOVID",
			value: 0.616504854368932,
		},
		{
			source: "ER_ADULT_NOCOVID",
			target: "ICU_ADULT_COVID",
			value: 0.005882352941176471,
		},
		{
			source: "ER_ADULT_COVID",
			target: "ICU_ADULT_COVID",
			value: 0.02164502164502164,
		},
		{
			source: "WARD_ADULT_COVID",
			target: "ICU_ADULT_COVID",
			value: 0.09736842105263158,
		},
		{
			source: "WARD_ADULT_NOCOVID",
			target: "ICU_ADULT_COVID",
			value: 0.08237986270022883,
		},
		{
			source: "ICU_ADULT_NOCOVID",
			target: "ICU_ADULT_COVID",
			value: 0.04854368932038835,
		},
		{
			source: "ER_ADULT_NOCOVID",
			target: "ICU_ADULT_NOCOVID",
			value: 0.005123339658444023,
		},
		{
			source: "ER_ADULT_COVID",
			target: "ICU_ADULT_NOCOVID",
			value: 0.004329004329004329,
		},
		{
			source: "WARD_ADULT_COVID",
			target: "ICU_ADULT_NOCOVID",
			value: 0.01578947368421053,
		},
		{
			source: "WARD_ADULT_NOCOVID",
			target: "ICU_ADULT_NOCOVID",
			value: 0.04519450800915332,
		},
		{
			source: "ICU_ADULT_COVID",
			target: "ICU_ADULT_NOCOVID",
			value: 0.04183266932270916,
		},
	],
};

[CallumDowling]

Any update on this?

Edit: my issue was having col:"2", instead of col:2 in nodes.

[tomshanley]

No fix as yet. I've started a new library (sankey-plus) and I'm working on fixing or replacing the layout option that auto sizes, which causes this issue