adaptor.js 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163
  1. "use strict";
  2. Object.defineProperty(exports, "__esModule", { value: true });
  3. exports.adaptor = exports.interaction = exports.meta = void 0;
  4. var tslib_1 = require("tslib");
  5. var util_1 = require("@antv/util");
  6. var common_1 = require("../../adaptor/common");
  7. var locale_1 = require("../../core/locale");
  8. var utils_1 = require("../../utils");
  9. var conversion_1 = require("../../utils/conversion");
  10. var constant_1 = require("./constant");
  11. var basic_1 = require("./geometries/basic");
  12. var compare_1 = require("./geometries/compare");
  13. var dynamic_height_1 = require("./geometries/dynamic-height");
  14. var facet_1 = require("./geometries/facet");
  15. var interactions_1 = require("./interactions");
  16. /**
  17. *
  18. * 各式漏斗图geometry实现细节有较大不同,
  19. * 1. 普通漏斗图:interval.shape('funnel')
  20. * 2. 对比漏斗图:分面
  21. * 3. 动态高度漏斗图:polypon
  22. * 4. 分面漏斗图:普通 + list 分面
  23. * /
  24. /**
  25. * options 处理
  26. * @param params
  27. */
  28. function defaultOptions(params) {
  29. var options = params.options;
  30. var compareField = options.compareField, xField = options.xField, yField = options.yField, locale = options.locale, funnelStyle = options.funnelStyle, data = options.data;
  31. var i18n = (0, locale_1.getLocale)(locale);
  32. var defaultOption = {
  33. label: compareField
  34. ? {
  35. fields: [xField, yField, compareField, constant_1.FUNNEL_PERCENT, constant_1.FUNNEL_CONVERSATION],
  36. formatter: function (datum) { return "".concat(datum[yField]); },
  37. }
  38. : {
  39. fields: [xField, yField, constant_1.FUNNEL_PERCENT, constant_1.FUNNEL_CONVERSATION],
  40. offset: 0,
  41. position: 'middle',
  42. formatter: function (datum) { return "".concat(datum[xField], " ").concat(datum[yField]); },
  43. },
  44. tooltip: {
  45. title: xField,
  46. formatter: function (datum) {
  47. return { name: datum[xField], value: datum[yField] };
  48. },
  49. },
  50. conversionTag: {
  51. // conversionTag 的计算和显示逻辑统一保持一致
  52. formatter: function (datum) {
  53. return "".concat(i18n.get(['conversionTag', 'label']), ": ").concat(conversion_1.conversionTagFormatter.apply(void 0, datum[constant_1.FUNNEL_CONVERSATION]));
  54. },
  55. },
  56. };
  57. // 漏斗图样式
  58. var style;
  59. if (compareField || funnelStyle) {
  60. style = function (datum) {
  61. return (0, utils_1.deepAssign)({},
  62. // 对比漏斗图默认描边
  63. compareField && { lineWidth: 1, stroke: '#fff' }, (0, util_1.isFunction)(funnelStyle) ? funnelStyle(datum) : funnelStyle);
  64. };
  65. }
  66. return (0, utils_1.deepAssign)({ options: defaultOption }, params, { options: { funnelStyle: style, data: (0, util_1.clone)(data) } });
  67. }
  68. /**
  69. * geometry处理
  70. * @param params
  71. */
  72. function geometry(params) {
  73. var options = params.options;
  74. var compareField = options.compareField, dynamicHeight = options.dynamicHeight, seriesField = options.seriesField;
  75. if (seriesField) {
  76. return (0, facet_1.facetFunnel)(params);
  77. }
  78. if (compareField) {
  79. return (0, compare_1.compareFunnel)(params);
  80. }
  81. if (dynamicHeight) {
  82. return (0, dynamic_height_1.dynamicHeightFunnel)(params);
  83. }
  84. return (0, basic_1.basicFunnel)(params);
  85. }
  86. /**
  87. * meta 配置
  88. * @param params
  89. */
  90. function meta(params) {
  91. var _a;
  92. var options = params.options;
  93. var xAxis = options.xAxis, yAxis = options.yAxis, xField = options.xField, yField = options.yField;
  94. return (0, utils_1.flow)((0, common_1.scale)((_a = {},
  95. _a[xField] = xAxis,
  96. _a[yField] = yAxis,
  97. _a)))(params);
  98. }
  99. exports.meta = meta;
  100. /**
  101. * 坐标轴
  102. * @param params
  103. */
  104. function axis(params) {
  105. var chart = params.chart;
  106. chart.axis(false);
  107. return params;
  108. }
  109. /**
  110. * legend 配置
  111. * @param params
  112. */
  113. function legend(params) {
  114. var chart = params.chart, options = params.options;
  115. var legend = options.legend;
  116. if (legend === false) {
  117. chart.legend(false);
  118. }
  119. else {
  120. chart.legend(legend);
  121. // TODO FIX: legend-click 时间和转化率组件之间的关联
  122. }
  123. return params;
  124. }
  125. /**
  126. * Interaction 配置
  127. * @param params
  128. */
  129. function interaction(params) {
  130. var chart = params.chart, options = params.options;
  131. // @ts-ignore
  132. var interactions = options.interactions, dynamicHeight = options.dynamicHeight;
  133. (0, util_1.each)(interactions, function (i) {
  134. if (i.enable === false) {
  135. chart.removeInteraction(i.type);
  136. }
  137. else {
  138. chart.interaction(i.type, i.cfg || {});
  139. }
  140. });
  141. // 动态高度 不进行交互操作
  142. if (!dynamicHeight) {
  143. chart.interaction(interactions_1.FUNNEL_LEGEND_FILTER, {
  144. start: [tslib_1.__assign(tslib_1.__assign({}, interactions_1.interactionStart), { arg: options })],
  145. });
  146. }
  147. else {
  148. chart.removeInteraction(interactions_1.FUNNEL_LEGEND_FILTER);
  149. }
  150. return params;
  151. }
  152. exports.interaction = interaction;
  153. /**
  154. * 漏斗图适配器
  155. * @param chart
  156. * @param options
  157. */
  158. function adaptor(params) {
  159. return (0, utils_1.flow)(defaultOptions, geometry, meta, axis, common_1.tooltip, interaction, legend, common_1.animation, common_1.theme, (0, common_1.annotation)())(params);
  160. }
  161. exports.adaptor = adaptor;
  162. //# sourceMappingURL=adaptor.js.map