Вы не можете выбрать более 25 тем Темы должны начинаться с буквы или цифры, могут содержать дефисы(-) и должны содержать не более 35 символов.
 
 
 
 

238 строки
7.6 KiB

  1. 'use strict';
  2. Object.defineProperty(exports, "__esModule", {
  3. value: true
  4. });
  5. var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
  6. var _react = require('react');
  7. var _react2 = _interopRequireDefault(_react);
  8. var _propTypes = require('prop-types');
  9. var _propTypes2 = _interopRequireDefault(_propTypes);
  10. var _d3Sankey = require('d3-sankey');
  11. var _xyPlot = require('../plot/xy-plot');
  12. var _xyPlot2 = _interopRequireDefault(_xyPlot);
  13. var _chartUtils = require('../utils/chart-utils');
  14. var _verticalRectSeries = require('../plot/series/vertical-rect-series');
  15. var _verticalRectSeries2 = _interopRequireDefault(_verticalRectSeries);
  16. var _labelSeries = require('../plot/series/label-series');
  17. var _labelSeries2 = _interopRequireDefault(_labelSeries);
  18. var _voronoi = require('../plot/voronoi');
  19. var _voronoi2 = _interopRequireDefault(_voronoi);
  20. var _theme = require('../theme');
  21. var _sankeyLink = require('./sankey-link');
  22. var _sankeyLink2 = _interopRequireDefault(_sankeyLink);
  23. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
  24. function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
  25. var NOOP = function NOOP(f) {
  26. return f;
  27. };
  28. var ALIGNMENTS = {
  29. justify: _d3Sankey.sankeyJustify,
  30. center: _d3Sankey.sankeyCenter,
  31. left: _d3Sankey.sankeyLeft,
  32. right: _d3Sankey.sankeyRight
  33. };
  34. var DEFAULT_MARGINS = {
  35. top: 20,
  36. left: 20,
  37. right: 20,
  38. bottom: 20
  39. };
  40. function Sankey(props) {
  41. var align = props.align,
  42. animation = props.animation,
  43. children = props.children,
  44. className = props.className,
  45. hasVoronoi = props.hasVoronoi,
  46. height = props.height,
  47. hideLabels = props.hideLabels,
  48. labelRotation = props.labelRotation,
  49. layout = props.layout,
  50. links = props.links,
  51. linkOpacity = props.linkOpacity,
  52. margin = props.margin,
  53. nodePadding = props.nodePadding,
  54. nodes = props.nodes,
  55. nodeWidth = props.nodeWidth,
  56. onValueClick = props.onValueClick,
  57. onValueMouseOver = props.onValueMouseOver,
  58. onValueMouseOut = props.onValueMouseOut,
  59. onLinkClick = props.onLinkClick,
  60. onLinkMouseOver = props.onLinkMouseOver,
  61. onLinkMouseOut = props.onLinkMouseOut,
  62. style = props.style,
  63. width = props.width;
  64. var nodesCopy = [].concat(_toConsumableArray(new Array(nodes.length))).map(function (e, i) {
  65. return _extends({}, nodes[i]);
  66. });
  67. var linksCopy = [].concat(_toConsumableArray(new Array(links.length))).map(function (e, i) {
  68. return _extends({}, links[i]);
  69. });
  70. var _getInnerDimensions = (0, _chartUtils.getInnerDimensions)({
  71. margin: margin,
  72. height: height,
  73. width: width
  74. }, DEFAULT_MARGINS),
  75. marginLeft = _getInnerDimensions.marginLeft,
  76. marginTop = _getInnerDimensions.marginTop,
  77. marginRight = _getInnerDimensions.marginRight,
  78. marginBottom = _getInnerDimensions.marginBottom;
  79. var sankeyInstance = (0, _d3Sankey.sankey)().extent([[marginLeft, marginTop], [width - marginRight, height - marginBottom - marginTop]]).nodeWidth(nodeWidth).nodePadding(nodePadding).nodes(nodesCopy).links(linksCopy).nodeAlign(ALIGNMENTS[align]).iterations(layout);
  80. sankeyInstance(nodesCopy);
  81. var nWidth = sankeyInstance.nodeWidth();
  82. var path = (0, _d3Sankey.sankeyLinkHorizontal)();
  83. return _react2.default.createElement(
  84. _xyPlot2.default,
  85. _extends({}, props, { yType: 'literal', className: 'rv-sankey ' + className }),
  86. linksCopy.map(function (link, i) {
  87. return _react2.default.createElement(_sankeyLink2.default, {
  88. style: style.links,
  89. data: path(link),
  90. opacity: link.opacity || linkOpacity,
  91. color: link.color,
  92. onLinkClick: onLinkClick,
  93. onLinkMouseOver: onLinkMouseOver,
  94. onLinkMouseOut: onLinkMouseOut,
  95. strokeWidth: Math.max(link.width, 1),
  96. node: link,
  97. nWidth: nWidth,
  98. key: 'link-' + i
  99. });
  100. }),
  101. _react2.default.createElement(_verticalRectSeries2.default, {
  102. animation: animation,
  103. className: className + ' rv-sankey__node',
  104. data: nodesCopy.map(function (node) {
  105. return _extends({}, node, {
  106. y: node.y1 - marginTop,
  107. y0: node.y0 - marginTop,
  108. x: node.x1,
  109. x0: node.x0,
  110. color: node.color || _theme.DISCRETE_COLOR_RANGE[0],
  111. sourceLinks: null,
  112. targetLinks: null
  113. });
  114. }),
  115. style: style.rects,
  116. onValueClick: onValueClick,
  117. onValueMouseOver: onValueMouseOver,
  118. onValueMouseOut: onValueMouseOut,
  119. colorType: 'literal'
  120. }),
  121. !hideLabels && _react2.default.createElement(_labelSeries2.default, {
  122. animation: animation,
  123. className: className,
  124. rotation: labelRotation,
  125. labelAnchorY: 'text-before-edge',
  126. data: nodesCopy.map(function (node, i) {
  127. return _extends({
  128. x: node.x0 + (node.x0 < width / 2 ? nWidth + 10 : -10),
  129. y: (node.y0 + node.y1) / 2 - marginTop,
  130. label: node.name,
  131. style: _extends({
  132. textAnchor: node.x0 < width / 2 ? 'start' : 'end',
  133. dy: '-.5em'
  134. }, style.labels)
  135. }, nodes[i]);
  136. })
  137. }),
  138. hasVoronoi && _react2.default.createElement(_voronoi2.default, {
  139. className: 'rv-sankey__voronoi',
  140. extent: [[-marginLeft, -marginTop], [width + marginRight, height + marginBottom]],
  141. nodes: nodesCopy,
  142. onClick: onValueClick,
  143. onHover: onValueMouseOver,
  144. onBlur: onValueMouseOut,
  145. x: function x(d) {
  146. return d.x0 + (d.x1 - d.x0) / 2;
  147. },
  148. y: function y(d) {
  149. return d.y0 + (d.y1 - d.y0) / 2;
  150. }
  151. }),
  152. children
  153. );
  154. }
  155. Sankey.defaultProps = {
  156. align: 'justify',
  157. className: '',
  158. hasVoronoi: false,
  159. hideLabels: false,
  160. labelRotation: 0,
  161. layout: 50,
  162. margin: DEFAULT_MARGINS,
  163. nodePadding: 10,
  164. nodeWidth: 10,
  165. onValueMouseOver: NOOP,
  166. onValueClick: NOOP,
  167. onValueMouseOut: NOOP,
  168. onLinkClick: NOOP,
  169. onLinkMouseOver: NOOP,
  170. onLinkMouseOut: NOOP,
  171. style: {
  172. links: {},
  173. rects: {},
  174. labels: {}
  175. }
  176. };
  177. Sankey.propTypes = {
  178. align: _propTypes2.default.oneOf(['justify', 'left', 'right', 'center']),
  179. className: _propTypes2.default.string,
  180. hasVoronoi: _propTypes2.default.bool,
  181. height: _propTypes2.default.number.isRequired,
  182. hideLabels: _propTypes2.default.bool,
  183. labelRotation: _propTypes2.default.number,
  184. layout: _propTypes2.default.number,
  185. links: _propTypes2.default.arrayOf(_propTypes2.default.shape({
  186. source: _propTypes2.default.oneOfType([_propTypes2.default.number, _propTypes2.default.object]).isRequired,
  187. target: _propTypes2.default.oneOfType([_propTypes2.default.number, _propTypes2.default.object]).isRequired
  188. })).isRequired,
  189. margin: _chartUtils.MarginPropType,
  190. nodePadding: _propTypes2.default.number,
  191. nodes: _propTypes2.default.arrayOf(_propTypes2.default.object).isRequired,
  192. nodeWidth: _propTypes2.default.number,
  193. onValueMouseOver: _propTypes2.default.func,
  194. onValueClick: _propTypes2.default.func,
  195. onValueMouseOut: _propTypes2.default.func,
  196. onLinkClick: _propTypes2.default.func,
  197. onLinkMouseOver: _propTypes2.default.func,
  198. onLinkMouseOut: _propTypes2.default.func,
  199. style: _propTypes2.default.shape({
  200. links: _propTypes2.default.object,
  201. rects: _propTypes2.default.object,
  202. labels: _propTypes2.default.object
  203. }),
  204. width: _propTypes2.default.number.isRequired
  205. };
  206. exports.default = Sankey;