adaptor.js 5.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152
  1. "use strict";
  2. Object.defineProperty(exports, "__esModule", { value: true });
  3. exports.adaptor = void 0;
  4. var tslib_1 = require("tslib");
  5. var common_1 = require("../../adaptor/common");
  6. var geometries_1 = require("../../adaptor/geometries");
  7. var utils_1 = require("../../utils");
  8. var chord_1 = require("../../utils/transform/chord");
  9. var constant_1 = require("./constant");
  10. function transformData(params) {
  11. // 将弦图数据放到ext中,nodeGeometry edgeGeometry使用
  12. var options = params.options;
  13. var data = options.data, sourceField = options.sourceField, targetField = options.targetField, weightField = options.weightField, nodePaddingRatio = options.nodePaddingRatio, nodeWidthRatio = options.nodeWidthRatio, _a = options.rawFields, rawFields = _a === void 0 ? [] : _a;
  14. // 将数据转换为node link格式
  15. var chordLayoutInputData = (0, utils_1.transformDataToNodeLinkData)(data, sourceField, targetField, weightField);
  16. var _b = (0, chord_1.chordLayout)({ weight: true, nodePaddingRatio: nodePaddingRatio, nodeWidthRatio: nodeWidthRatio }, chordLayoutInputData), nodes = _b.nodes, links = _b.links;
  17. // 1. 生成绘制node使用数据
  18. var nodesData = nodes.map(function (node) {
  19. return tslib_1.__assign(tslib_1.__assign({}, (0, utils_1.pick)(node, tslib_1.__spreadArray(['id', 'x', 'y', 'name'], rawFields, true))), { isNode: true });
  20. });
  21. // 2. 生成 edge 使用数据 (同桑基图)
  22. var edgesData = links.map(function (link) {
  23. return tslib_1.__assign(tslib_1.__assign({ source: link.source.name, target: link.target.name, name: link.source.name || link.target.name }, (0, utils_1.pick)(link, tslib_1.__spreadArray(['x', 'y', 'value'], rawFields, true))), { isNode: false });
  24. });
  25. return tslib_1.__assign(tslib_1.__assign({}, params), { ext: tslib_1.__assign(tslib_1.__assign({}, params.ext), {
  26. // 将chordData放到ext中,方便下面的geometry使用
  27. chordData: { nodesData: nodesData, edgesData: edgesData } }) });
  28. }
  29. /**
  30. * scale配置
  31. * @param params 参数
  32. */
  33. function scale(params) {
  34. var _a;
  35. var chart = params.chart;
  36. chart.scale((_a = {
  37. x: { sync: true, nice: true },
  38. y: { sync: true, nice: true, max: 1 }
  39. },
  40. _a[constant_1.NODE_COLOR_FIELD] = { sync: 'color' },
  41. _a[constant_1.EDGE_COLOR_FIELD] = { sync: 'color' },
  42. _a));
  43. return params;
  44. }
  45. /**
  46. * axis配置
  47. * @param params 参数
  48. */
  49. function axis(params) {
  50. var chart = params.chart;
  51. chart.axis(false);
  52. return params;
  53. }
  54. /**
  55. * legend配置
  56. * @param params 参数
  57. */
  58. function legend(params) {
  59. var chart = params.chart;
  60. chart.legend(false);
  61. return params;
  62. }
  63. /**
  64. * tooltip配置
  65. * @param params 参数
  66. */
  67. function tooltip(params) {
  68. var chart = params.chart, options = params.options;
  69. var tooltip = options.tooltip;
  70. chart.tooltip(tooltip);
  71. return params;
  72. }
  73. /**
  74. * coordinate配置
  75. * @param params 参数
  76. */
  77. function coordinate(params) {
  78. var chart = params.chart;
  79. chart.coordinate('polar').reflect('y');
  80. return params;
  81. }
  82. /**
  83. * nodeGeometry配置
  84. * @param params 参数
  85. */
  86. function nodeGeometry(params) {
  87. // node view
  88. var chart = params.chart, options = params.options;
  89. var nodesData = params.ext.chordData.nodesData;
  90. var nodeStyle = options.nodeStyle, label = options.label, tooltip = options.tooltip;
  91. var nodeView = chart.createView();
  92. nodeView.data(nodesData);
  93. // 面
  94. (0, geometries_1.polygon)({
  95. chart: nodeView,
  96. options: {
  97. xField: constant_1.X_FIELD,
  98. yField: constant_1.Y_FIELD,
  99. seriesField: constant_1.NODE_COLOR_FIELD,
  100. polygon: {
  101. style: nodeStyle,
  102. },
  103. label: label,
  104. tooltip: tooltip,
  105. },
  106. });
  107. return params;
  108. }
  109. /**
  110. * edgeGeometry配置
  111. * @param params 参数
  112. */
  113. function edgeGeometry(params) {
  114. var chart = params.chart, options = params.options;
  115. var edgesData = params.ext.chordData.edgesData;
  116. var edgeStyle = options.edgeStyle, tooltip = options.tooltip;
  117. var edgeView = chart.createView();
  118. edgeView.data(edgesData);
  119. // edge
  120. var edgeOptions = {
  121. xField: constant_1.X_FIELD,
  122. yField: constant_1.Y_FIELD,
  123. seriesField: constant_1.EDGE_COLOR_FIELD,
  124. edge: {
  125. style: edgeStyle,
  126. shape: 'arc',
  127. },
  128. tooltip: tooltip,
  129. };
  130. (0, geometries_1.edge)({
  131. chart: edgeView,
  132. options: edgeOptions,
  133. });
  134. return params;
  135. }
  136. function animation(params) {
  137. var chart = params.chart, options = params.options;
  138. var animation = options.animation;
  139. (0, utils_1.addViewAnimation)(chart, animation, (0, utils_1.getAllGeometriesRecursively)(chart));
  140. return params;
  141. }
  142. /**
  143. * 弦图适配器
  144. * @param chart
  145. * @param options
  146. */
  147. function adaptor(params) {
  148. // flow 的方式处理所有的配置到 G2 API
  149. return (0, utils_1.flow)(common_1.theme, transformData, coordinate, scale, axis, legend, tooltip, edgeGeometry, nodeGeometry, common_1.interaction, common_1.state, animation)(params);
  150. }
  151. exports.adaptor = adaptor;
  152. //# sourceMappingURL=adaptor.js.map