dependency-wheel.src.js 16 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393
  1. /**
  2. * @license Highcharts JS v8.2.0 (2020-08-20)
  3. *
  4. * Dependency wheel module
  5. *
  6. * (c) 2010-2018 Torstein Honsi
  7. *
  8. * License: www.highcharts.com/license
  9. */
  10. 'use strict';
  11. (function (factory) {
  12. if (typeof module === 'object' && module.exports) {
  13. factory['default'] = factory;
  14. module.exports = factory;
  15. } else if (typeof define === 'function' && define.amd) {
  16. define('highcharts/modules/dependency-wheel', ['highcharts', 'highcharts/modules/sankey'], function (Highcharts) {
  17. factory(Highcharts);
  18. factory.Highcharts = Highcharts;
  19. return factory;
  20. });
  21. } else {
  22. factory(typeof Highcharts !== 'undefined' ? Highcharts : undefined);
  23. }
  24. }(function (Highcharts) {
  25. var _modules = Highcharts ? Highcharts._modules : {};
  26. function _registerModule(obj, path, args, fn) {
  27. if (!obj.hasOwnProperty(path)) {
  28. obj[path] = fn.apply(null, args);
  29. }
  30. }
  31. _registerModule(_modules, 'Series/DependencyWheelSeries.js', [_modules['Core/Globals.js'], _modules['Core/Utilities.js'], _modules['Mixins/Nodes.js']], function (H, U, NodesMixin) {
  32. /* *
  33. *
  34. * Dependency wheel module
  35. *
  36. * (c) 2018-2020 Torstein Honsi
  37. *
  38. * License: www.highcharts.com/license
  39. *
  40. * !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
  41. *
  42. * */
  43. var animObject = U.animObject,
  44. seriesType = U.seriesType;
  45. var base = H.seriesTypes.sankey.prototype;
  46. /**
  47. * @private
  48. * @class
  49. * @name Highcharts.seriesTypes.dependencywheel
  50. *
  51. * @augments Highcharts.seriesTypes.sankey
  52. */
  53. seriesType('dependencywheel', 'sankey',
  54. /**
  55. * A dependency wheel chart is a type of flow diagram, where all nodes are
  56. * laid out in a circle, and the flow between the are drawn as link bands.
  57. *
  58. * @sample highcharts/demo/dependency-wheel/
  59. * Dependency wheel
  60. *
  61. * @extends plotOptions.sankey
  62. * @exclude dataSorting
  63. * @since 7.1.0
  64. * @product highcharts
  65. * @requires modules/dependencywheel
  66. * @optionparent plotOptions.dependencywheel
  67. */
  68. {
  69. /**
  70. * The center of the wheel relative to the plot area. Can be
  71. * percentages or pixel values. The default behaviour is to
  72. * center the wheel inside the plot area.
  73. *
  74. * @type {Array<number|string|null>}
  75. * @default [null, null]
  76. * @product highcharts
  77. */
  78. center: [null, null],
  79. curveFactor: 0.6,
  80. /**
  81. * The start angle of the dependency wheel, in degrees where 0 is up.
  82. */
  83. startAngle: 0
  84. }, {
  85. orderNodes: false,
  86. getCenter: H.seriesTypes.pie.prototype.getCenter,
  87. /* eslint-disable valid-jsdoc */
  88. /**
  89. * Dependency wheel has only one column, it runs along the perimeter.
  90. * @private
  91. */
  92. createNodeColumns: function () {
  93. var columns = [this.createNodeColumn()];
  94. this.nodes.forEach(function (node) {
  95. node.column = 0;
  96. columns[0].push(node);
  97. });
  98. return columns;
  99. },
  100. /**
  101. * Translate from vertical pixels to perimeter.
  102. * @private
  103. */
  104. getNodePadding: function () {
  105. return this.options.nodePadding / Math.PI;
  106. },
  107. createNode: function (id) {
  108. var node = base.createNode.call(this,
  109. id);
  110. node.index = this.nodes.length - 1;
  111. /**
  112. * Return the sum of incoming and outgoing links.
  113. * @private
  114. */
  115. node.getSum = function () {
  116. return node.linksFrom
  117. .concat(node.linksTo)
  118. .reduce(function (acc, link) {
  119. return acc + link.weight;
  120. }, 0);
  121. };
  122. /**
  123. * Get the offset in weight values of a point/link.
  124. * @private
  125. */
  126. node.offset = function (point) {
  127. var offset = 0,
  128. i,
  129. links = node.linksFrom.concat(node.linksTo),
  130. sliced;
  131. /**
  132. * @private
  133. */
  134. function otherNode(link) {
  135. if (link.fromNode === node) {
  136. return link.toNode;
  137. }
  138. return link.fromNode;
  139. }
  140. // Sort and slice the links to avoid links going out of each
  141. // node crossing each other.
  142. links.sort(function (a, b) {
  143. return otherNode(a).index - otherNode(b).index;
  144. });
  145. for (i = 0; i < links.length; i++) {
  146. if (otherNode(links[i]).index > node.index) {
  147. links = links.slice(0, i).reverse().concat(links.slice(i).reverse());
  148. sliced = true;
  149. break;
  150. }
  151. }
  152. if (!sliced) {
  153. links.reverse();
  154. }
  155. for (i = 0; i < links.length; i++) {
  156. if (links[i] === point) {
  157. return offset;
  158. }
  159. offset += links[i].weight;
  160. }
  161. };
  162. return node;
  163. },
  164. /**
  165. * @private
  166. * @todo Override the refactored sankey translateLink and translateNode
  167. * functions instead of the whole translate function.
  168. */
  169. translate: function () {
  170. var options = this.options,
  171. factor = 2 * Math.PI /
  172. (this.chart.plotHeight + this.getNodePadding()),
  173. center = this.getCenter(),
  174. startAngle = (options.startAngle - 90) * H.deg2rad;
  175. base.translate.call(this);
  176. this.nodeColumns[0].forEach(function (node) {
  177. // Don't render the nodes if sum is 0 #12453
  178. if (node.sum) {
  179. var shapeArgs = node.shapeArgs,
  180. centerX = center[0],
  181. centerY = center[1],
  182. r = center[2] / 2,
  183. innerR = r - options.nodeWidth,
  184. start = startAngle + factor * shapeArgs.y,
  185. end = startAngle +
  186. factor * (shapeArgs.y + shapeArgs.height);
  187. // Middle angle
  188. node.angle = start + (end - start) / 2;
  189. node.shapeType = 'arc';
  190. node.shapeArgs = {
  191. x: centerX,
  192. y: centerY,
  193. r: r,
  194. innerR: innerR,
  195. start: start,
  196. end: end
  197. };
  198. node.dlBox = {
  199. x: centerX + Math.cos((start + end) / 2) * (r + innerR) / 2,
  200. y: centerY + Math.sin((start + end) / 2) * (r + innerR) / 2,
  201. width: 1,
  202. height: 1
  203. };
  204. // Draw the links from this node
  205. node.linksFrom.forEach(function (point) {
  206. if (point.linkBase) {
  207. var distance;
  208. var corners = point.linkBase.map(function (top,
  209. i) {
  210. var angle = factor * top,
  211. x = Math.cos(startAngle + angle) * (innerR + 1),
  212. y = Math.sin(startAngle + angle) * (innerR + 1),
  213. curveFactor = options.curveFactor;
  214. // The distance between the from and to node
  215. // along the perimeter. This affect how curved
  216. // the link is, so that links between neighbours
  217. // don't extend too far towards the center.
  218. distance = Math.abs(point.linkBase[3 - i] * factor - angle);
  219. if (distance > Math.PI) {
  220. distance = 2 * Math.PI - distance;
  221. }
  222. distance = distance * innerR;
  223. if (distance < innerR) {
  224. curveFactor *= (distance / innerR);
  225. }
  226. return {
  227. x: centerX + x,
  228. y: centerY + y,
  229. cpX: centerX + (1 - curveFactor) * x,
  230. cpY: centerY + (1 - curveFactor) * y
  231. };
  232. });
  233. point.shapeArgs = {
  234. d: [[
  235. 'M',
  236. corners[0].x, corners[0].y
  237. ], [
  238. 'A',
  239. innerR, innerR,
  240. 0,
  241. 0,
  242. 1,
  243. corners[1].x, corners[1].y
  244. ], [
  245. 'C',
  246. corners[1].cpX, corners[1].cpY,
  247. corners[2].cpX, corners[2].cpY,
  248. corners[2].x, corners[2].y
  249. ], [
  250. 'A',
  251. innerR, innerR,
  252. 0,
  253. 0,
  254. 1,
  255. corners[3].x, corners[3].y
  256. ], [
  257. 'C',
  258. corners[3].cpX, corners[3].cpY,
  259. corners[0].cpX, corners[0].cpY,
  260. corners[0].x, corners[0].y
  261. ]]
  262. };
  263. }
  264. });
  265. }
  266. });
  267. },
  268. animate: function (init) {
  269. if (!init) {
  270. var duration = animObject(this.options.animation).duration,
  271. step = (duration / 2) / this.nodes.length;
  272. this.nodes.forEach(function (point, i) {
  273. var graphic = point.graphic;
  274. if (graphic) {
  275. graphic.attr({ opacity: 0 });
  276. setTimeout(function () {
  277. graphic.animate({ opacity: 1 }, { duration: step });
  278. }, step * i);
  279. }
  280. }, this);
  281. this.points.forEach(function (point) {
  282. var graphic = point.graphic;
  283. if (!point.isNode && graphic) {
  284. graphic.attr({ opacity: 0 })
  285. .animate({
  286. opacity: 1
  287. }, this.options.animation);
  288. }
  289. }, this);
  290. }
  291. }
  292. /* eslint-enable valid-jsdoc */
  293. },
  294. // Point class
  295. {
  296. setState: NodesMixin.setNodeState,
  297. /* eslint-disable valid-jsdoc */
  298. /**
  299. * Return a text path that the data label uses.
  300. * @private
  301. */
  302. getDataLabelPath: function (label) {
  303. var renderer = this.series.chart.renderer,
  304. shapeArgs = this.shapeArgs,
  305. upperHalf = this.angle < 0 || this.angle > Math.PI,
  306. start = shapeArgs.start,
  307. end = shapeArgs.end;
  308. if (!this.dataLabelPath) {
  309. this.dataLabelPath = renderer
  310. .arc({ open: true })
  311. // Add it inside the data label group so it gets destroyed
  312. // with the label
  313. .add(label);
  314. }
  315. this.dataLabelPath.attr({
  316. x: shapeArgs.x,
  317. y: shapeArgs.y,
  318. r: (shapeArgs.r +
  319. (this.dataLabel.options.distance || 0)),
  320. start: (upperHalf ? start : end),
  321. end: (upperHalf ? end : start),
  322. clockwise: +upperHalf
  323. });
  324. return this.dataLabelPath;
  325. },
  326. isValid: function () {
  327. // No null points here
  328. return true;
  329. }
  330. /* eslint-enable valid-jsdoc */
  331. });
  332. /**
  333. * A `dependencywheel` series. If the [type](#series.dependencywheel.type)
  334. * option is not specified, it is inherited from [chart.type](#chart.type).
  335. *
  336. * @extends series,plotOptions.dependencywheel
  337. * @exclude dataSorting
  338. * @product highcharts
  339. * @requires modules/dependencywheel
  340. * @apioption series.dependencywheel
  341. */
  342. /**
  343. * A collection of options for the individual nodes. The nodes in a dependency
  344. * diagram are auto-generated instances of `Highcharts.Point`, but options can
  345. * be applied here and linked by the `id`.
  346. *
  347. * @extends series.sankey.nodes
  348. * @type {Array<*>}
  349. * @product highcharts
  350. * @excluding offset
  351. * @apioption series.dependencywheel.nodes
  352. */
  353. /**
  354. * An array of data points for the series. For the `dependencywheel` series
  355. * type, points can be given in the following way:
  356. *
  357. * An array of objects with named values. The following snippet shows only a
  358. * few settings, see the complete options set below. If the total number of data
  359. * points exceeds the series' [turboThreshold](#series.area.turboThreshold),
  360. * this option is not available.
  361. *
  362. * ```js
  363. * data: [{
  364. * from: 'Category1',
  365. * to: 'Category2',
  366. * weight: 2
  367. * }, {
  368. * from: 'Category1',
  369. * to: 'Category3',
  370. * weight: 5
  371. * }]
  372. * ```
  373. *
  374. * @type {Array<*>}
  375. * @extends series.sankey.data
  376. * @product highcharts
  377. * @excluding outgoing, dataLabels
  378. * @apioption series.dependencywheel.data
  379. */
  380. /**
  381. * Individual data label for each node. The options are the same as
  382. * the ones for [series.dependencywheel.dataLabels](#series.dependencywheel.dataLabels).
  383. *
  384. * @apioption series.dependencywheel.nodes.dataLabels
  385. */
  386. ''; // adds doclets above to the transpiled file
  387. });
  388. _registerModule(_modules, 'masters/modules/dependency-wheel.src.js', [], function () {
  389. });
  390. }));