SankeySeries.js 41 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126
  1. /* *
  2. *
  3. * Sankey diagram module
  4. *
  5. * (c) 2010-2021 Torstein Honsi
  6. *
  7. * License: www.highcharts.com/license
  8. *
  9. * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
  10. *
  11. * */
  12. 'use strict';
  13. var __extends = (this && this.__extends) || (function () {
  14. var extendStatics = function (d, b) {
  15. extendStatics = Object.setPrototypeOf ||
  16. ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
  17. function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
  18. return extendStatics(d, b);
  19. };
  20. return function (d, b) {
  21. extendStatics(d, b);
  22. function __() { this.constructor = d; }
  23. d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
  24. };
  25. })();
  26. import Color from '../../Core/Color/Color.js';
  27. import H from '../../Core/Globals.js';
  28. import NodesMixin from '../../Mixins/Nodes.js';
  29. import SankeyPoint from './SankeyPoint.js';
  30. import SeriesRegistry from '../../Core/Series/SeriesRegistry.js';
  31. var Series = SeriesRegistry.series, ColumnSeries = SeriesRegistry.seriesTypes.column;
  32. import TreeSeriesMixin from '../../Mixins/TreeSeries.js';
  33. var getLevelOptions = TreeSeriesMixin.getLevelOptions;
  34. import U from '../../Core/Utilities.js';
  35. var defined = U.defined, extend = U.extend, find = U.find, isObject = U.isObject, merge = U.merge, pick = U.pick, relativeLength = U.relativeLength, stableSort = U.stableSort;
  36. /* *
  37. *
  38. * Class
  39. *
  40. * */
  41. /**
  42. * @private
  43. * @class
  44. * @name Highcharts.seriesTypes.sankey
  45. *
  46. * @augments Highcharts.Series
  47. */
  48. var SankeySeries = /** @class */ (function (_super) {
  49. __extends(SankeySeries, _super);
  50. function SankeySeries() {
  51. /* *
  52. *
  53. * Static Properties
  54. *
  55. * */
  56. var _this = _super !== null && _super.apply(this, arguments) || this;
  57. /* *
  58. *
  59. * Properties
  60. *
  61. * */
  62. _this.colDistance = void 0;
  63. _this.data = void 0;
  64. _this.group = void 0;
  65. _this.nodeLookup = void 0;
  66. _this.nodePadding = void 0;
  67. _this.nodes = void 0;
  68. _this.nodeWidth = void 0;
  69. _this.options = void 0;
  70. _this.points = void 0;
  71. _this.translationFactor = void 0;
  72. return _this;
  73. /* eslint-enable valid-jsdoc */
  74. }
  75. /* *
  76. *
  77. * Static Functions
  78. *
  79. * */
  80. // eslint-disable-next-line valid-jsdoc
  81. /**
  82. * @private
  83. */
  84. SankeySeries.getDLOptions = function (params) {
  85. var optionsPoint = (isObject(params.optionsPoint) ?
  86. params.optionsPoint.dataLabels :
  87. {}), optionsLevel = (isObject(params.level) ?
  88. params.level.dataLabels :
  89. {}), options = merge({
  90. style: {}
  91. }, optionsLevel, optionsPoint);
  92. return options;
  93. };
  94. /* *
  95. *
  96. * Functions
  97. *
  98. * */
  99. /* eslint-disable valid-jsdoc */
  100. /**
  101. * Create a node column.
  102. * @private
  103. */
  104. SankeySeries.prototype.createNodeColumn = function () {
  105. var series = this, chart = this.chart, column = [];
  106. column.sum = function () {
  107. return this.reduce(function (sum, node) {
  108. return sum + node.getSum();
  109. }, 0);
  110. };
  111. // Get the offset in pixels of a node inside the column.
  112. column.offset = function (node, factor) {
  113. var offset = 0, totalNodeOffset, nodePadding = series.nodePadding;
  114. for (var i = 0; i < column.length; i++) {
  115. var sum = column[i].getSum();
  116. var height = Math.max(sum * factor, series.options.minLinkWidth);
  117. if (sum) {
  118. totalNodeOffset = height + nodePadding;
  119. }
  120. else {
  121. // If node sum equals 0 nodePadding is missed #12453
  122. totalNodeOffset = 0;
  123. }
  124. if (column[i] === node) {
  125. return {
  126. relativeTop: offset + relativeLength(node.options.offset || 0, totalNodeOffset)
  127. };
  128. }
  129. offset += totalNodeOffset;
  130. }
  131. };
  132. // Get the top position of the column in pixels.
  133. column.top = function (factor) {
  134. var nodePadding = series.nodePadding;
  135. var height = this.reduce(function (height, node) {
  136. if (height > 0) {
  137. height += nodePadding;
  138. }
  139. var nodeHeight = Math.max(node.getSum() * factor, series.options.minLinkWidth);
  140. height += nodeHeight;
  141. return height;
  142. }, 0);
  143. return (chart.plotSizeY - height) / 2;
  144. };
  145. return column;
  146. };
  147. /**
  148. * Create node columns by analyzing the nodes and the relations between
  149. * incoming and outgoing links.
  150. * @private
  151. */
  152. SankeySeries.prototype.createNodeColumns = function () {
  153. var columns = [];
  154. this.nodes.forEach(function (node) {
  155. var fromColumn = -1, fromNode, i, point;
  156. if (!defined(node.options.column)) {
  157. // No links to this node, place it left
  158. if (node.linksTo.length === 0) {
  159. node.column = 0;
  160. // There are incoming links, place it to the right of the
  161. // highest order column that links to this one.
  162. }
  163. else {
  164. for (i = 0; i < node.linksTo.length; i++) {
  165. point = node.linksTo[0];
  166. if (point.fromNode.column > fromColumn) {
  167. fromNode = point.fromNode;
  168. fromColumn = fromNode.column;
  169. }
  170. }
  171. node.column = fromColumn + 1;
  172. // Hanging layout for organization chart
  173. if (fromNode &&
  174. fromNode.options.layout === 'hanging') {
  175. node.hangsFrom = fromNode;
  176. i = -1; // Reuse existing variable i
  177. find(fromNode.linksFrom, function (link, index) {
  178. var found = link.toNode === node;
  179. if (found) {
  180. i = index;
  181. }
  182. return found;
  183. });
  184. node.column += i;
  185. }
  186. }
  187. }
  188. if (!columns[node.column]) {
  189. columns[node.column] = this.createNodeColumn();
  190. }
  191. columns[node.column].push(node);
  192. }, this);
  193. // Fill in empty columns (#8865)
  194. for (var i = 0; i < columns.length; i++) {
  195. if (typeof columns[i] === 'undefined') {
  196. columns[i] = this.createNodeColumn();
  197. }
  198. }
  199. return columns;
  200. };
  201. /**
  202. * Extend generatePoints by adding the nodes, which are Point objects
  203. * but pushed to the this.nodes array.
  204. * @private
  205. */
  206. SankeySeries.prototype.generatePoints = function () {
  207. NodesMixin.generatePoints.apply(this, arguments);
  208. /**
  209. * Order the nodes, starting with the root node(s). (#9818)
  210. * @private
  211. */
  212. function order(node, level) {
  213. // Prevents circular recursion:
  214. if (typeof node.level === 'undefined') {
  215. node.level = level;
  216. node.linksFrom.forEach(function (link) {
  217. if (link.toNode) {
  218. order(link.toNode, level + 1);
  219. }
  220. });
  221. }
  222. }
  223. if (this.orderNodes) {
  224. this.nodes
  225. // Identify the root node(s)
  226. .filter(function (node) {
  227. return node.linksTo.length === 0;
  228. })
  229. // Start by the root node(s) and recursively set the level
  230. // on all following nodes.
  231. .forEach(function (node) {
  232. order(node, 0);
  233. });
  234. stableSort(this.nodes, function (a, b) {
  235. return a.level - b.level;
  236. });
  237. }
  238. };
  239. /**
  240. * Overridable function to get node padding, overridden in dependency
  241. * wheel series type.
  242. * @private
  243. */
  244. SankeySeries.prototype.getNodePadding = function () {
  245. var nodePadding = this.options.nodePadding || 0;
  246. // If the number of columns is so great that they will overflow with
  247. // the given nodePadding, we sacrifice the padding in order to
  248. // render all nodes within the plot area (#11917).
  249. if (this.nodeColumns) {
  250. var maxLength = this.nodeColumns.reduce(function (acc, col) { return Math.max(acc, col.length); }, 0);
  251. if (maxLength * nodePadding > this.chart.plotSizeY) {
  252. nodePadding = this.chart.plotSizeY / maxLength;
  253. }
  254. }
  255. return nodePadding;
  256. };
  257. /**
  258. * Define hasData function for non-cartesian series.
  259. * @private
  260. * @return {boolean}
  261. * Returns true if the series has points at all.
  262. */
  263. SankeySeries.prototype.hasData = function () {
  264. return !!this.processedXData.length; // != 0
  265. };
  266. /**
  267. * Return the presentational attributes.
  268. * @private
  269. */
  270. SankeySeries.prototype.pointAttribs = function (point, state) {
  271. if (!point) {
  272. return {};
  273. }
  274. var series = this, level = point.isNode ? point.level : point.fromNode.level, levelOptions = series.mapOptionsToLevel[level || 0] || {}, options = point.options, stateOptions = (levelOptions.states && levelOptions.states[state || '']) || {}, values = [
  275. 'colorByPoint', 'borderColor', 'borderWidth', 'linkOpacity'
  276. ].reduce(function (obj, key) {
  277. obj[key] = pick(stateOptions[key], options[key], levelOptions[key], series.options[key]);
  278. return obj;
  279. }, {}), color = pick(stateOptions.color, options.color, values.colorByPoint ? point.color : levelOptions.color);
  280. // Node attributes
  281. if (point.isNode) {
  282. return {
  283. fill: color,
  284. stroke: values.borderColor,
  285. 'stroke-width': values.borderWidth
  286. };
  287. }
  288. // Link attributes
  289. return {
  290. fill: Color.parse(color).setOpacity(values.linkOpacity).get()
  291. };
  292. };
  293. /**
  294. * Extend the render function to also render this.nodes together with
  295. * the points.
  296. * @private
  297. */
  298. SankeySeries.prototype.render = function () {
  299. var points = this.points;
  300. this.points = this.points.concat(this.nodes || []);
  301. ColumnSeries.prototype.render.call(this);
  302. this.points = points;
  303. };
  304. /**
  305. * Run pre-translation by generating the nodeColumns.
  306. * @private
  307. */
  308. SankeySeries.prototype.translate = function () {
  309. var _this = this;
  310. // Get the translation factor needed for each column to fill up the
  311. // plot height
  312. var getColumnTranslationFactor = function (column) {
  313. var nodes = column.slice();
  314. var minLinkWidth = _this.options.minLinkWidth || 0;
  315. var exceedsMinLinkWidth;
  316. var factor = 0;
  317. var i;
  318. var remainingHeight = chart.plotSizeY -
  319. options.borderWidth - (column.length - 1) * series.nodePadding;
  320. // Because the minLinkWidth option doesn't obey the direct
  321. // translation, we need to run translation iteratively, check
  322. // node heights, remove those nodes affected by minLinkWidth,
  323. // check again, etc.
  324. while (column.length) {
  325. factor = remainingHeight / column.sum();
  326. exceedsMinLinkWidth = false;
  327. i = column.length;
  328. while (i--) {
  329. if (column[i].getSum() * factor < minLinkWidth) {
  330. column.splice(i, 1);
  331. remainingHeight -= minLinkWidth;
  332. exceedsMinLinkWidth = true;
  333. }
  334. }
  335. if (!exceedsMinLinkWidth) {
  336. break;
  337. }
  338. }
  339. // Re-insert original nodes
  340. column.length = 0;
  341. nodes.forEach(function (node) { return column.push(node); });
  342. return factor;
  343. };
  344. if (!this.processedXData) {
  345. this.processData();
  346. }
  347. this.generatePoints();
  348. this.nodeColumns = this.createNodeColumns();
  349. this.nodeWidth = relativeLength(this.options.nodeWidth, this.chart.plotSizeX);
  350. var series = this, chart = this.chart, options = this.options, nodeWidth = this.nodeWidth, nodeColumns = this.nodeColumns;
  351. this.nodePadding = this.getNodePadding();
  352. // Find out how much space is needed. Base it on the translation
  353. // factor of the most spaceous column.
  354. this.translationFactor = nodeColumns.reduce(function (translationFactor, column) { return Math.min(translationFactor, getColumnTranslationFactor(column)); }, Infinity);
  355. this.colDistance =
  356. (chart.plotSizeX - nodeWidth -
  357. options.borderWidth) / Math.max(1, nodeColumns.length - 1);
  358. // Calculate level options used in sankey and organization
  359. series.mapOptionsToLevel = getLevelOptions({
  360. // NOTE: if support for allowTraversingTree is added, then from
  361. // should be the level of the root node.
  362. from: 1,
  363. levels: options.levels,
  364. to: nodeColumns.length - 1,
  365. defaults: {
  366. borderColor: options.borderColor,
  367. borderRadius: options.borderRadius,
  368. borderWidth: options.borderWidth,
  369. color: series.color,
  370. colorByPoint: options.colorByPoint,
  371. // NOTE: if support for allowTraversingTree is added, then
  372. // levelIsConstant should be optional.
  373. levelIsConstant: true,
  374. linkColor: options.linkColor,
  375. linkLineWidth: options.linkLineWidth,
  376. linkOpacity: options.linkOpacity,
  377. states: options.states
  378. }
  379. });
  380. // First translate all nodes so we can use them when drawing links
  381. nodeColumns.forEach(function (column) {
  382. column.forEach(function (node) {
  383. series.translateNode(node, column);
  384. });
  385. }, this);
  386. // Then translate links
  387. this.nodes.forEach(function (node) {
  388. // Translate the links from this node
  389. node.linksFrom.forEach(function (linkPoint) {
  390. // If weight is 0 - don't render the link path #12453,
  391. // render null points (for organization chart)
  392. if ((linkPoint.weight || linkPoint.isNull) && linkPoint.to) {
  393. series.translateLink(linkPoint);
  394. linkPoint.allowShadow = false;
  395. }
  396. });
  397. });
  398. };
  399. /**
  400. * Run translation operations for one link.
  401. * @private
  402. */
  403. SankeySeries.prototype.translateLink = function (point) {
  404. var getY = function (node, fromOrTo) {
  405. var _a;
  406. var linkTop = (node.offset(point, fromOrTo) *
  407. translationFactor);
  408. var y = Math.min(node.nodeY + linkTop,
  409. // Prevent links from spilling below the node (#12014)
  410. node.nodeY + ((_a = node.shapeArgs) === null || _a === void 0 ? void 0 : _a.height) - linkHeight);
  411. return y;
  412. };
  413. var fromNode = point.fromNode, toNode = point.toNode, chart = this.chart, translationFactor = this.translationFactor, linkHeight = Math.max(point.weight * translationFactor, this.options.minLinkWidth), options = this.options, curvy = ((chart.inverted ? -this.colDistance : this.colDistance) *
  414. options.curveFactor), fromY = getY(fromNode, 'linksFrom'), toY = getY(toNode, 'linksTo'), nodeLeft = fromNode.nodeX, nodeW = this.nodeWidth, right = toNode.column * this.colDistance, outgoing = point.outgoing, straight = right > nodeLeft + nodeW;
  415. if (chart.inverted) {
  416. fromY = chart.plotSizeY - fromY;
  417. toY = (chart.plotSizeY || 0) - toY;
  418. right = chart.plotSizeX - right;
  419. nodeW = -nodeW;
  420. linkHeight = -linkHeight;
  421. straight = nodeLeft > right;
  422. }
  423. point.shapeType = 'path';
  424. point.linkBase = [
  425. fromY,
  426. fromY + linkHeight,
  427. toY,
  428. toY + linkHeight
  429. ];
  430. // Links going from left to right
  431. if (straight && typeof toY === 'number') {
  432. point.shapeArgs = {
  433. d: [
  434. ['M', nodeLeft + nodeW, fromY],
  435. [
  436. 'C',
  437. nodeLeft + nodeW + curvy,
  438. fromY,
  439. right - curvy,
  440. toY,
  441. right,
  442. toY
  443. ],
  444. ['L', right + (outgoing ? nodeW : 0), toY + linkHeight / 2],
  445. ['L', right, toY + linkHeight],
  446. [
  447. 'C',
  448. right - curvy,
  449. toY + linkHeight,
  450. nodeLeft + nodeW + curvy,
  451. fromY + linkHeight,
  452. nodeLeft + nodeW, fromY + linkHeight
  453. ],
  454. ['Z']
  455. ]
  456. };
  457. // Experimental: Circular links pointing backwards. In
  458. // v6.1.0 this breaks the rendering completely, so even
  459. // this experimental rendering is an improvement. #8218.
  460. // @todo
  461. // - Make room for the link in the layout
  462. // - Automatically determine if the link should go up or
  463. // down.
  464. }
  465. else if (typeof toY === 'number') {
  466. var bend = 20, vDist = chart.plotHeight - fromY - linkHeight, x1 = right - bend - linkHeight, x2 = right - bend, x3 = right, x4 = nodeLeft + nodeW, x5 = x4 + bend, x6 = x5 + linkHeight, fy1 = fromY, fy2 = fromY + linkHeight, fy3 = fy2 + bend, y4 = fy3 + vDist, y5 = y4 + bend, y6 = y5 + linkHeight, ty1 = toY, ty2 = ty1 + linkHeight, ty3 = ty2 + bend, cfy1 = fy2 - linkHeight * 0.7, cy2 = y5 + linkHeight * 0.7, cty1 = ty2 - linkHeight * 0.7, cx1 = x3 - linkHeight * 0.7, cx2 = x4 + linkHeight * 0.7;
  467. point.shapeArgs = {
  468. d: [
  469. ['M', x4, fy1],
  470. ['C', cx2, fy1, x6, cfy1, x6, fy3],
  471. ['L', x6, y4],
  472. ['C', x6, cy2, cx2, y6, x4, y6],
  473. ['L', x3, y6],
  474. ['C', cx1, y6, x1, cy2, x1, y4],
  475. ['L', x1, ty3],
  476. ['C', x1, cty1, cx1, ty1, x3, ty1],
  477. ['L', x3, ty2],
  478. ['C', x2, ty2, x2, ty2, x2, ty3],
  479. ['L', x2, y4],
  480. ['C', x2, y5, x2, y5, x3, y5],
  481. ['L', x4, y5],
  482. ['C', x5, y5, x5, y5, x5, y4],
  483. ['L', x5, fy3],
  484. ['C', x5, fy2, x5, fy2, x4, fy2],
  485. ['Z']
  486. ]
  487. };
  488. }
  489. // Place data labels in the middle
  490. point.dlBox = {
  491. x: nodeLeft + (right - nodeLeft + nodeW) / 2,
  492. y: fromY + (toY - fromY) / 2,
  493. height: linkHeight,
  494. width: 0
  495. };
  496. // And set the tooltip anchor in the middle
  497. point.tooltipPos = chart.inverted ? [
  498. chart.plotSizeY - point.dlBox.y - linkHeight / 2,
  499. chart.plotSizeX - point.dlBox.x
  500. ] : [
  501. point.dlBox.x,
  502. point.dlBox.y + linkHeight / 2
  503. ];
  504. // Pass test in drawPoints
  505. point.y = point.plotY = 1;
  506. if (!point.color) {
  507. point.color = fromNode.color;
  508. }
  509. };
  510. /**
  511. * Run translation operations for one node.
  512. * @private
  513. */
  514. SankeySeries.prototype.translateNode = function (node, column) {
  515. var translationFactor = this.translationFactor, chart = this.chart, options = this.options, sum = node.getSum(), height = Math.max(Math.round(sum * translationFactor), this.options.minLinkWidth), crisp = Math.round(options.borderWidth) % 2 / 2, nodeOffset = column.offset(node, translationFactor), fromNodeTop = Math.floor(pick(nodeOffset.absoluteTop, (column.top(translationFactor) +
  516. nodeOffset.relativeTop))) + crisp, left = Math.floor(this.colDistance * node.column +
  517. options.borderWidth / 2) + crisp, nodeLeft = chart.inverted ?
  518. chart.plotSizeX - left :
  519. left, nodeWidth = Math.round(this.nodeWidth);
  520. node.sum = sum;
  521. // If node sum is 0, don't render the rect #12453
  522. if (sum) {
  523. // Draw the node
  524. node.shapeType = 'rect';
  525. node.nodeX = nodeLeft;
  526. node.nodeY = fromNodeTop;
  527. if (!chart.inverted) {
  528. node.shapeArgs = {
  529. x: nodeLeft,
  530. y: fromNodeTop,
  531. width: node.options.width || options.width || nodeWidth,
  532. height: node.options.height || options.height || height
  533. };
  534. }
  535. else {
  536. node.shapeArgs = {
  537. x: nodeLeft - nodeWidth,
  538. y: chart.plotSizeY - fromNodeTop - height,
  539. width: node.options.height || options.height || nodeWidth,
  540. height: node.options.width || options.width || height
  541. };
  542. }
  543. node.shapeArgs.display = node.hasShape() ? '' : 'none';
  544. // Calculate data label options for the point
  545. node.dlOptions = SankeySeries.getDLOptions({
  546. level: this.mapOptionsToLevel[node.level],
  547. optionsPoint: node.options
  548. });
  549. // Pass test in drawPoints
  550. node.plotY = 1;
  551. // Set the anchor position for tooltips
  552. node.tooltipPos = chart.inverted ? [
  553. chart.plotSizeY - node.shapeArgs.y - node.shapeArgs.height / 2,
  554. chart.plotSizeX - node.shapeArgs.x - node.shapeArgs.width / 2
  555. ] : [
  556. node.shapeArgs.x + node.shapeArgs.width / 2,
  557. node.shapeArgs.y + node.shapeArgs.height / 2
  558. ];
  559. }
  560. else {
  561. node.dlOptions = {
  562. enabled: false
  563. };
  564. }
  565. };
  566. /**
  567. * A sankey diagram is a type of flow diagram, in which the width of the
  568. * link between two nodes is shown proportionally to the flow quantity.
  569. *
  570. * @sample highcharts/demo/sankey-diagram/
  571. * Sankey diagram
  572. * @sample highcharts/plotoptions/sankey-inverted/
  573. * Inverted sankey diagram
  574. * @sample highcharts/plotoptions/sankey-outgoing
  575. * Sankey diagram with outgoing links
  576. *
  577. * @extends plotOptions.column
  578. * @since 6.0.0
  579. * @product highcharts
  580. * @excluding animationLimit, boostThreshold, borderRadius,
  581. * crisp, cropThreshold, colorAxis, colorKey, depth, dragDrop,
  582. * edgeColor, edgeWidth, findNearestPointBy, grouping,
  583. * groupPadding, groupZPadding, maxPointWidth, negativeColor,
  584. * pointInterval, pointIntervalUnit, pointPadding,
  585. * pointPlacement, pointRange, pointStart, pointWidth,
  586. * shadow, softThreshold, stacking, threshold, zoneAxis,
  587. * zones, minPointLength, dataSorting, boostBlending
  588. * @requires modules/sankey
  589. * @optionparent plotOptions.sankey
  590. */
  591. SankeySeries.defaultOptions = merge(ColumnSeries.defaultOptions, {
  592. borderWidth: 0,
  593. colorByPoint: true,
  594. /**
  595. * Higher numbers makes the links in a sankey diagram or dependency
  596. * wheelrender more curved. A `curveFactor` of 0 makes the lines
  597. * straight.
  598. *
  599. * @private
  600. */
  601. curveFactor: 0.33,
  602. /**
  603. * Options for the data labels appearing on top of the nodes and links.
  604. * For sankey charts, data labels are visible for the nodes by default,
  605. * but hidden for links. This is controlled by modifying the
  606. * `nodeFormat`, and the `format` that applies to links and is an empty
  607. * string by default.
  608. *
  609. * @declare Highcharts.SeriesSankeyDataLabelsOptionsObject
  610. *
  611. * @private
  612. */
  613. dataLabels: {
  614. enabled: true,
  615. backgroundColor: 'none',
  616. crop: false,
  617. /**
  618. * The
  619. * [format string](https://www.highcharts.com/docs/chart-concepts/labels-and-string-formatting)
  620. * specifying what to show for _nodes_ in the sankey diagram. By
  621. * default the `nodeFormatter` returns `{point.name}`.
  622. *
  623. * @sample highcharts/plotoptions/sankey-link-datalabels/
  624. * Node and link data labels
  625. *
  626. * @type {string}
  627. */
  628. nodeFormat: void 0,
  629. // eslint-disable-next-line valid-jsdoc
  630. /**
  631. * Callback to format data labels for _nodes_ in the sankey diagram.
  632. * The `nodeFormat` option takes precedence over the
  633. * `nodeFormatter`.
  634. *
  635. * @type {Highcharts.SeriesSankeyDataLabelsFormatterCallbackFunction}
  636. * @since 6.0.2
  637. */
  638. nodeFormatter: function () {
  639. return this.point.name;
  640. },
  641. format: void 0,
  642. // eslint-disable-next-line valid-jsdoc
  643. /**
  644. * @type {Highcharts.SeriesSankeyDataLabelsFormatterCallbackFunction}
  645. */
  646. formatter: function () {
  647. return;
  648. },
  649. inside: true
  650. },
  651. /**
  652. * @ignore-option
  653. *
  654. * @private
  655. */
  656. inactiveOtherPoints: true,
  657. /**
  658. * Set options on specific levels. Takes precedence over series options,
  659. * but not node and link options.
  660. *
  661. * @sample highcharts/demo/sunburst
  662. * Sunburst chart
  663. *
  664. * @type {Array<*>}
  665. * @since 7.1.0
  666. * @apioption plotOptions.sankey.levels
  667. */
  668. /**
  669. * Can set `borderColor` on all nodes which lay on the same level.
  670. *
  671. * @type {Highcharts.ColorString}
  672. * @apioption plotOptions.sankey.levels.borderColor
  673. */
  674. /**
  675. * Can set `borderWidth` on all nodes which lay on the same level.
  676. *
  677. * @type {number}
  678. * @apioption plotOptions.sankey.levels.borderWidth
  679. */
  680. /**
  681. * Can set `color` on all nodes which lay on the same level.
  682. *
  683. * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}
  684. * @apioption plotOptions.sankey.levels.color
  685. */
  686. /**
  687. * Can set `colorByPoint` on all nodes which lay on the same level.
  688. *
  689. * @type {boolean}
  690. * @default true
  691. * @apioption plotOptions.sankey.levels.colorByPoint
  692. */
  693. /**
  694. * Can set `dataLabels` on all points which lay on the same level.
  695. *
  696. * @extends plotOptions.sankey.dataLabels
  697. * @apioption plotOptions.sankey.levels.dataLabels
  698. */
  699. /**
  700. * Decides which level takes effect from the options set in the levels
  701. * object.
  702. *
  703. * @type {number}
  704. * @apioption plotOptions.sankey.levels.level
  705. */
  706. /**
  707. * Can set `linkOpacity` on all points which lay on the same level.
  708. *
  709. * @type {number}
  710. * @default 0.5
  711. * @apioption plotOptions.sankey.levels.linkOpacity
  712. */
  713. /**
  714. * Can set `states` on all nodes and points which lay on the same level.
  715. *
  716. * @extends plotOptions.sankey.states
  717. * @apioption plotOptions.sankey.levels.states
  718. */
  719. /**
  720. * Opacity for the links between nodes in the sankey diagram.
  721. *
  722. * @private
  723. */
  724. linkOpacity: 0.5,
  725. /**
  726. * The minimal width for a line of a sankey. By default,
  727. * 0 values are not shown.
  728. *
  729. * @sample highcharts/plotoptions/sankey-minlinkwidth
  730. * Sankey diagram with minimal link height
  731. *
  732. * @type {number}
  733. * @since 7.1.3
  734. * @default 0
  735. * @apioption plotOptions.sankey.minLinkWidth
  736. *
  737. * @private
  738. */
  739. minLinkWidth: 0,
  740. /**
  741. * The pixel width of each node in a sankey diagram or dependency wheel,
  742. * or the height in case the chart is inverted.
  743. *
  744. * @private
  745. */
  746. nodeWidth: 20,
  747. /**
  748. * The padding between nodes in a sankey diagram or dependency wheel, in
  749. * pixels.
  750. *
  751. * If the number of nodes is so great that it is possible to lay them
  752. * out within the plot area with the given `nodePadding`, they will be
  753. * rendered with a smaller padding as a strategy to avoid overflow.
  754. *
  755. * @private
  756. */
  757. nodePadding: 10,
  758. showInLegend: false,
  759. states: {
  760. hover: {
  761. /**
  762. * Opacity for the links between nodes in the sankey diagram in
  763. * hover mode.
  764. */
  765. linkOpacity: 1
  766. },
  767. /**
  768. * The opposite state of a hover for a single point node/link.
  769. *
  770. * @declare Highcharts.SeriesStatesInactiveOptionsObject
  771. */
  772. inactive: {
  773. /**
  774. * Opacity for the links between nodes in the sankey diagram in
  775. * inactive mode.
  776. */
  777. linkOpacity: 0.1,
  778. /**
  779. * Opacity of inactive markers.
  780. *
  781. * @type {number}
  782. * @apioption plotOptions.series.states.inactive.opacity
  783. */
  784. opacity: 0.1,
  785. /**
  786. * Animation when not hovering over the marker.
  787. *
  788. * @type {boolean|Partial<Highcharts.AnimationOptionsObject>}
  789. * @apioption plotOptions.series.states.inactive.animation
  790. */
  791. animation: {
  792. /** @internal */
  793. duration: 50
  794. }
  795. }
  796. },
  797. tooltip: {
  798. /**
  799. * A callback for defining the format for _nodes_ in the chart's
  800. * tooltip, as opposed to links.
  801. *
  802. * @type {Highcharts.FormatterCallbackFunction<Highcharts.SankeyNodeObject>}
  803. * @since 6.0.2
  804. * @apioption plotOptions.sankey.tooltip.nodeFormatter
  805. */
  806. /**
  807. * Whether the tooltip should follow the pointer or stay fixed on
  808. * the item.
  809. */
  810. followPointer: true,
  811. headerFormat: '<span style="font-size: 10px">{series.name}</span><br/>',
  812. pointFormat: '{point.fromNode.name} \u2192 {point.toNode.name}: <b>{point.weight}</b><br/>',
  813. /**
  814. * The
  815. * [format string](https://www.highcharts.com/docs/chart-concepts/labels-and-string-formatting)
  816. * specifying what to show for _nodes_ in tooltip of a diagram
  817. * series, as opposed to links.
  818. */
  819. nodeFormat: '{point.name}: <b>{point.sum}</b><br/>'
  820. }
  821. });
  822. return SankeySeries;
  823. }(ColumnSeries));
  824. extend(SankeySeries.prototype, {
  825. animate: Series.prototype.animate,
  826. // Create a single node that holds information on incoming and outgoing
  827. // links.
  828. createNode: NodesMixin.createNode,
  829. destroy: NodesMixin.destroy,
  830. forceDL: true,
  831. invertible: true,
  832. isCartesian: false,
  833. orderNodes: true,
  834. pointArrayMap: ['from', 'to'],
  835. pointClass: SankeyPoint,
  836. searchPoint: H.noop,
  837. setData: NodesMixin.setData
  838. });
  839. SeriesRegistry.registerSeriesType('sankey', SankeySeries);
  840. /* *
  841. *
  842. * Default Export
  843. *
  844. * */
  845. export default SankeySeries;
  846. /* *
  847. *
  848. * API Declarations
  849. *
  850. * */
  851. /**
  852. * A node in a sankey diagram.
  853. *
  854. * @interface Highcharts.SankeyNodeObject
  855. * @extends Highcharts.Point
  856. * @product highcharts
  857. */ /**
  858. * The color of the auto generated node.
  859. *
  860. * @name Highcharts.SankeyNodeObject#color
  861. * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}
  862. */ /**
  863. * The color index of the auto generated node, especially for use in styled
  864. * mode.
  865. *
  866. * @name Highcharts.SankeyNodeObject#colorIndex
  867. * @type {number}
  868. */ /**
  869. * An optional column index of where to place the node. The default behaviour is
  870. * to place it next to the preceding node.
  871. *
  872. * @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/sankey-node-column/|Highcharts-Demo:}
  873. * Specified node column
  874. *
  875. * @name Highcharts.SankeyNodeObject#column
  876. * @type {number}
  877. * @since 6.0.5
  878. */ /**
  879. * The id of the auto-generated node, refering to the `from` or `to` setting of
  880. * the link.
  881. *
  882. * @name Highcharts.SankeyNodeObject#id
  883. * @type {string}
  884. */ /**
  885. * The name to display for the node in data labels and tooltips. Use this when
  886. * the name is different from the `id`. Where the id must be unique for each
  887. * node, this is not necessary for the name.
  888. *
  889. * @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/css/sankey/|Highcharts-Demo:}
  890. * Sankey diagram with node options
  891. *
  892. * @name Highcharts.SankeyNodeObject#name
  893. * @type {string}
  894. * @product highcharts
  895. */ /**
  896. * The vertical offset of a node in terms of weight. Positive values shift the
  897. * node downwards, negative shift it upwards.
  898. *
  899. * @see {@link https://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/plotoptions/sankey-node-column/|Highcharts-Demo:}
  900. * Specified node offset
  901. *
  902. * @name Highcharts.SankeyNodeObject#offset
  903. * @type {number}
  904. * @default 0
  905. * @since 6.0.5
  906. */
  907. /**
  908. * Formatter callback function.
  909. *
  910. * @callback Highcharts.SeriesSankeyDataLabelsFormatterCallbackFunction
  911. *
  912. * @param {Highcharts.SeriesSankeyDataLabelsFormatterContextObject|Highcharts.PointLabelObject} this
  913. * Data label context to format
  914. *
  915. * @return {string|undefined}
  916. * Formatted data label text
  917. */
  918. /**
  919. * Context for the node formatter function.
  920. *
  921. * @interface Highcharts.SeriesSankeyDataLabelsFormatterContextObject
  922. * @extends Highcharts.PointLabelObject
  923. */ /**
  924. * The node object. The node name, if defined, is available through
  925. * `this.point.name`.
  926. * @name Highcharts.SeriesSankeyDataLabelsFormatterContextObject#point
  927. * @type {Highcharts.SankeyNodeObject}
  928. */
  929. ''; // detach doclets above
  930. /* *
  931. *
  932. * API Options
  933. *
  934. * */
  935. /**
  936. * A `sankey` series. If the [type](#series.sankey.type) option is not
  937. * specified, it is inherited from [chart.type](#chart.type).
  938. *
  939. * @extends series,plotOptions.sankey
  940. * @excluding animationLimit, boostBlending, boostThreshold, borderColor,
  941. * borderRadius, borderWidth, crisp, cropThreshold, dataParser,
  942. * dataURL, depth, dragDrop, edgeColor, edgeWidth,
  943. * findNearestPointBy, getExtremesFromAll, grouping, groupPadding,
  944. * groupZPadding, label, maxPointWidth, negativeColor, pointInterval,
  945. * pointIntervalUnit, pointPadding, pointPlacement, pointRange,
  946. * pointStart, pointWidth, shadow, softThreshold, stacking,
  947. * threshold, zoneAxis, zones, dataSorting
  948. * @product highcharts
  949. * @requires modules/sankey
  950. * @apioption series.sankey
  951. */
  952. /**
  953. * A collection of options for the individual nodes. The nodes in a sankey
  954. * diagram are auto-generated instances of `Highcharts.Point`, but options can
  955. * be applied here and linked by the `id`.
  956. *
  957. * @sample highcharts/css/sankey/
  958. * Sankey diagram with node options
  959. *
  960. * @declare Highcharts.SeriesSankeyNodesOptionsObject
  961. * @type {Array<*>}
  962. * @product highcharts
  963. * @apioption series.sankey.nodes
  964. */
  965. /**
  966. * The id of the auto-generated node, refering to the `from` or `to` setting of
  967. * the link.
  968. *
  969. * @type {string}
  970. * @product highcharts
  971. * @apioption series.sankey.nodes.id
  972. */
  973. /**
  974. * The color of the auto generated node.
  975. *
  976. * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}
  977. * @product highcharts
  978. * @apioption series.sankey.nodes.color
  979. */
  980. /**
  981. * The color index of the auto generated node, especially for use in styled
  982. * mode.
  983. *
  984. * @type {number}
  985. * @product highcharts
  986. * @apioption series.sankey.nodes.colorIndex
  987. */
  988. /**
  989. * An optional column index of where to place the node. The default behaviour is
  990. * to place it next to the preceding node. Note that this option name is
  991. * counter intuitive in inverted charts, like for example an organization chart
  992. * rendered top down. In this case the "columns" are horizontal.
  993. *
  994. * @sample highcharts/plotoptions/sankey-node-column/
  995. * Specified node column
  996. *
  997. * @type {number}
  998. * @since 6.0.5
  999. * @product highcharts
  1000. * @apioption series.sankey.nodes.column
  1001. */
  1002. /**
  1003. * Individual data label for each node. The options are the same as
  1004. * the ones for [series.sankey.dataLabels](#series.sankey.dataLabels).
  1005. *
  1006. * @extends plotOptions.sankey.dataLabels
  1007. * @apioption series.sankey.nodes.dataLabels
  1008. */
  1009. /**
  1010. * An optional level index of where to place the node. The default behaviour is
  1011. * to place it next to the preceding node. Alias of `nodes.column`, but in
  1012. * inverted sankeys and org charts, the levels are laid out as rows.
  1013. *
  1014. * @type {number}
  1015. * @since 7.1.0
  1016. * @product highcharts
  1017. * @apioption series.sankey.nodes.level
  1018. */
  1019. /**
  1020. * The name to display for the node in data labels and tooltips. Use this when
  1021. * the name is different from the `id`. Where the id must be unique for each
  1022. * node, this is not necessary for the name.
  1023. *
  1024. * @sample highcharts/css/sankey/
  1025. * Sankey diagram with node options
  1026. *
  1027. * @type {string}
  1028. * @product highcharts
  1029. * @apioption series.sankey.nodes.name
  1030. */
  1031. /**
  1032. * In a horizontal layout, the vertical offset of a node in terms of weight.
  1033. * Positive values shift the node downwards, negative shift it upwards. In a
  1034. * vertical layout, like organization chart, the offset is horizontal.
  1035. *
  1036. * If a percantage string is given, the node is offset by the percentage of the
  1037. * node size plus `nodePadding`.
  1038. *
  1039. * @sample highcharts/plotoptions/sankey-node-column/
  1040. * Specified node offset
  1041. *
  1042. * @type {number|string}
  1043. * @default 0
  1044. * @since 6.0.5
  1045. * @product highcharts
  1046. * @apioption series.sankey.nodes.offset
  1047. */
  1048. /**
  1049. * An array of data points for the series. For the `sankey` series type,
  1050. * points can be given in the following way:
  1051. *
  1052. * An array of objects with named values. The following snippet shows only a
  1053. * few settings, see the complete options set below. If the total number of data
  1054. * points exceeds the series' [turboThreshold](#series.area.turboThreshold),
  1055. * this option is not available.
  1056. *
  1057. * ```js
  1058. * data: [{
  1059. * from: 'Category1',
  1060. * to: 'Category2',
  1061. * weight: 2
  1062. * }, {
  1063. * from: 'Category1',
  1064. * to: 'Category3',
  1065. * weight: 5
  1066. * }]
  1067. * ```
  1068. *
  1069. * @sample {highcharts} highcharts/series/data-array-of-objects/
  1070. * Config objects
  1071. *
  1072. * @declare Highcharts.SeriesSankeyPointOptionsObject
  1073. * @type {Array<*>}
  1074. * @extends series.line.data
  1075. * @excluding dragDrop, drilldown, marker, x, y
  1076. * @product highcharts
  1077. * @apioption series.sankey.data
  1078. */
  1079. /**
  1080. * The color for the individual _link_. By default, the link color is the same
  1081. * as the node it extends from. The `series.fillOpacity` option also applies to
  1082. * the points, so when setting a specific link color, consider setting the
  1083. * `fillOpacity` to 1.
  1084. *
  1085. * @type {Highcharts.ColorString|Highcharts.GradientColorObject|Highcharts.PatternObject}
  1086. * @product highcharts
  1087. * @apioption series.sankey.data.color
  1088. */
  1089. /**
  1090. * @type {Highcharts.SeriesSankeyDataLabelsOptionsObject|Array<Highcharts.SeriesSankeyDataLabelsOptionsObject>}
  1091. * @product highcharts
  1092. * @apioption series.sankey.data.dataLabels
  1093. */
  1094. /**
  1095. * The node that the link runs from.
  1096. *
  1097. * @type {string}
  1098. * @product highcharts
  1099. * @apioption series.sankey.data.from
  1100. */
  1101. /**
  1102. * The node that the link runs to.
  1103. *
  1104. * @type {string}
  1105. * @product highcharts
  1106. * @apioption series.sankey.data.to
  1107. */
  1108. /**
  1109. * Whether the link goes out of the system.
  1110. *
  1111. * @sample highcharts/plotoptions/sankey-outgoing
  1112. * Sankey chart with outgoing links
  1113. *
  1114. * @type {boolean}
  1115. * @default false
  1116. * @product highcharts
  1117. * @apioption series.sankey.data.outgoing
  1118. */
  1119. /**
  1120. * The weight of the link.
  1121. *
  1122. * @type {number|null}
  1123. * @product highcharts
  1124. * @apioption series.sankey.data.weight
  1125. */
  1126. ''; // adds doclets above to transpiled file