sankey.js 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113
  1. var __rest = (this && this.__rest) || function (s, e) {
  2. var t = {};
  3. for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
  4. t[p] = s[p];
  5. if (s != null && typeof Object.getOwnPropertySymbols === "function")
  6. for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
  7. if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
  8. t[p[i]] = s[p[i]];
  9. }
  10. return t;
  11. };
  12. import { deepMix } from '@antv/util';
  13. import { Sankey as SankeyTransform } from '../data/sankey';
  14. import { subObject } from '../utils/helper';
  15. import { subTooltip, maybeAnimation } from '../utils/mark';
  16. import { field, initializeData } from './utils';
  17. /**
  18. * @todo Add interaction
  19. * @todo Add source-link color mode
  20. */
  21. export const Sankey = (options) => {
  22. const DEFAULT_LAYOUT_OPTIONS = {
  23. nodeId: (d) => d.key,
  24. nodeWidth: 0.02,
  25. nodePadding: 0.02,
  26. };
  27. const DEFAULT_NODE_OPTIONS = {
  28. type: 'polygon',
  29. axis: false,
  30. legend: false,
  31. encode: {
  32. shape: 'polygon',
  33. x: 'x',
  34. y: 'y',
  35. },
  36. scale: {
  37. x: { type: 'identity' },
  38. y: { type: 'identity' },
  39. },
  40. style: {
  41. stroke: '#000',
  42. },
  43. };
  44. const DEFAULT_LINK_OPTIONS = {
  45. type: 'polygon',
  46. axis: false,
  47. legend: false,
  48. encode: {
  49. shape: 'ribbon',
  50. x: 'x',
  51. y: 'y',
  52. },
  53. style: {
  54. fillOpacity: 0.5,
  55. stroke: undefined,
  56. },
  57. };
  58. const DEFAULT_LABEL_OPTIONS = {
  59. textAlign: (d) => (d.x[0] < 0.5 ? 'start' : 'end'),
  60. position: (d) => (d.x[0] < 0.5 ? 'right' : 'left'),
  61. fontSize: 10,
  62. };
  63. return () => {
  64. const { data, encode = {}, scale, style = {}, layout = {}, nodeLabels = [], linkLabels = [], animate = {}, tooltip = {}, } = options;
  65. // Initialize data, generating nodes by link if is not specified.
  66. const { links, nodes } = initializeData(data, encode);
  67. // Extract encode for node and link.
  68. const nodeEncode = subObject(encode, 'node');
  69. const linkEncode = subObject(encode, 'link');
  70. const { key: nodeKey = (d) => d.key, color = nodeKey } = nodeEncode;
  71. // Transform data, using nodeKey as nodeId.
  72. const { links: linkData, nodes: nodeData } = SankeyTransform(Object.assign(Object.assign(Object.assign({}, DEFAULT_LAYOUT_OPTIONS), { nodeId: field(nodeKey) }), layout))({ links, nodes });
  73. // Extract label style and apply defaults.
  74. const _a = subObject(style, 'label'), { text = nodeKey, spacing = 5 } = _a, labelStyle = __rest(_a, ["text", "spacing"]);
  75. const key1 = field(nodeKey);
  76. const nodeTooltip = subTooltip(tooltip, 'node', {
  77. title: key1,
  78. items: [{ field: 'value' }],
  79. }, true);
  80. const linkTooltip = subTooltip(tooltip, 'link', {
  81. title: '',
  82. items: [
  83. (d) => ({ name: 'source', value: key1(d.source) }),
  84. (d) => ({ name: 'target', value: key1(d.target) }),
  85. ],
  86. });
  87. return [
  88. deepMix({}, DEFAULT_NODE_OPTIONS, {
  89. data: nodeData,
  90. encode: Object.assign(Object.assign({}, nodeEncode), { color }),
  91. scale,
  92. style: subObject(style, 'node'),
  93. labels: [
  94. Object.assign(Object.assign(Object.assign({}, DEFAULT_LABEL_OPTIONS), { text, dx: (d) => (d.x[0] < 0.5 ? spacing : -spacing) }), labelStyle),
  95. ...nodeLabels,
  96. ],
  97. tooltip: nodeTooltip,
  98. animate: maybeAnimation(animate, 'node'),
  99. axis: false,
  100. }),
  101. deepMix({}, DEFAULT_LINK_OPTIONS, {
  102. data: linkData,
  103. encode: linkEncode,
  104. labels: linkLabels,
  105. style: Object.assign({ fill: linkEncode.color ? undefined : '#aaa', strokeWidth: 0 }, subObject(style, 'link')),
  106. tooltip: linkTooltip,
  107. animate: maybeAnimation(animate, 'link'),
  108. }),
  109. ];
  110. };
  111. };
  112. Sankey.props = {};
  113. //# sourceMappingURL=sankey.js.map