adaptor.js 4.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128
  1. import { __spreadArray } from "tslib";
  2. import { get } from '@antv/util';
  3. import { animation, annotation, interaction as commonInteraction, legend, theme, tooltip } from '../../adaptor/common';
  4. import { polygon as basePolygon } from '../../adaptor/geometries/polygon';
  5. import { pattern } from '../../adaptor/pattern';
  6. import { deepAssign, flow } from '../../utils';
  7. import { getAdjustAppendPadding } from '../../utils/padding';
  8. import { enableDrillInteraction, findInteraction, transformData } from './utils';
  9. /**
  10. * 获取默认 option
  11. * @param params
  12. */
  13. function defaultOptions(params) {
  14. var options = params.options;
  15. var colorField = options.colorField;
  16. return deepAssign({
  17. options: {
  18. rawFields: ['value'],
  19. tooltip: {
  20. fields: ['name', 'value', colorField, 'path'],
  21. formatter: function (data) {
  22. return {
  23. name: data.name,
  24. value: data.value,
  25. };
  26. },
  27. },
  28. },
  29. }, params);
  30. }
  31. /**
  32. * 字段
  33. * @param params
  34. */
  35. function geometry(params) {
  36. var chart = params.chart, options = params.options;
  37. var color = options.color, colorField = options.colorField, rectStyle = options.rectStyle, hierarchyConfig = options.hierarchyConfig, rawFields = options.rawFields;
  38. var data = transformData({
  39. data: options.data,
  40. colorField: options.colorField,
  41. enableDrillDown: enableDrillInteraction(options),
  42. hierarchyConfig: hierarchyConfig,
  43. });
  44. chart.data(data);
  45. // geometry
  46. basePolygon(deepAssign({}, params, {
  47. options: {
  48. xField: 'x',
  49. yField: 'y',
  50. seriesField: colorField,
  51. rawFields: rawFields,
  52. polygon: {
  53. color: color,
  54. style: rectStyle,
  55. },
  56. },
  57. }));
  58. // 做一个反转,这样配合排序,可以将最大值放到左上角,最小值放到右下角
  59. chart.coordinate().reflect('y');
  60. return params;
  61. }
  62. /**
  63. * 坐标轴
  64. * @param params
  65. */
  66. function axis(params) {
  67. var chart = params.chart;
  68. chart.axis(false);
  69. return params;
  70. }
  71. function adaptorInteraction(options) {
  72. var drilldown = options.drilldown, _a = options.interactions, interactions = _a === void 0 ? [] : _a;
  73. var enableDrillDown = enableDrillInteraction(options);
  74. if (enableDrillDown) {
  75. return deepAssign({}, options, {
  76. interactions: __spreadArray(__spreadArray([], interactions, true), [
  77. {
  78. type: 'drill-down',
  79. // 🚓 这不是一个规范的 API,后续会变更。慎重参考
  80. cfg: { drillDownConfig: drilldown, transformData: transformData },
  81. },
  82. ], false),
  83. });
  84. }
  85. return options;
  86. }
  87. /**
  88. * Interaction 配置
  89. * @param params
  90. */
  91. export function interaction(params) {
  92. var chart = params.chart, options = params.options;
  93. var interactions = options.interactions, drilldown = options.drilldown;
  94. commonInteraction({
  95. chart: chart,
  96. options: adaptorInteraction(options),
  97. });
  98. // 适配 view-zoom
  99. var viewZoomInteraction = findInteraction(interactions, 'view-zoom');
  100. if (viewZoomInteraction) {
  101. // 开启缩放 interaction 后,则阻止默认滚动事件,避免整个窗口的滚动
  102. if (viewZoomInteraction.enable !== false) {
  103. chart.getCanvas().on('mousewheel', function (ev) {
  104. ev.preventDefault();
  105. });
  106. }
  107. else {
  108. // 手动关闭后,清除。仅对声明 viewZoomInteraction 的清除。
  109. chart.getCanvas().off('mousewheel');
  110. }
  111. }
  112. // 适应下钻交互面包屑
  113. var enableDrillDown = enableDrillInteraction(options);
  114. if (enableDrillDown) {
  115. // 为面包屑在底部留出 25px 的空间
  116. chart.appendPadding = getAdjustAppendPadding(chart.appendPadding, get(drilldown, ['breadCrumb', 'position']));
  117. }
  118. return params;
  119. }
  120. /**
  121. * 矩形树图
  122. * @param chart
  123. * @param options
  124. */
  125. export function adaptor(params) {
  126. return flow(defaultOptions, theme, pattern('rectStyle'), geometry, axis, legend, tooltip, interaction, animation, annotation())(params);
  127. }
  128. //# sourceMappingURL=adaptor.js.map