basic.js 3.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798
  1. "use strict";
  2. Object.defineProperty(exports, "__esModule", { value: true });
  3. exports.basicFunnel = exports.conversionTag = void 0;
  4. var tslib_1 = require("tslib");
  5. var util_1 = require("@antv/util");
  6. var base_1 = require("../../../adaptor/geometries/base");
  7. var utils_1 = require("../../../utils");
  8. var tooltip_1 = require("../../../utils/tooltip");
  9. var constant_1 = require("../constant");
  10. var common_1 = require("./common");
  11. /**
  12. * 处理字段数据
  13. * @param params
  14. */
  15. function field(params) {
  16. var chart = params.chart, options = params.options;
  17. var _a = options.data, data = _a === void 0 ? [] : _a, yField = options.yField, maxSize = options.maxSize, minSize = options.minSize;
  18. var formatData = (0, common_1.transformData)(data, data, {
  19. yField: yField,
  20. maxSize: maxSize,
  21. minSize: minSize,
  22. });
  23. // 绘制漏斗图
  24. chart.data(formatData);
  25. return params;
  26. }
  27. /**
  28. * geometry处理
  29. * @param params
  30. */
  31. function geometry(params) {
  32. var chart = params.chart, options = params.options;
  33. var xField = options.xField, yField = options.yField, color = options.color, tooltip = options.tooltip, label = options.label, _a = options.shape, shape = _a === void 0 ? 'funnel' : _a, funnelStyle = options.funnelStyle, state = options.state;
  34. var _b = (0, tooltip_1.getTooltipMapping)(tooltip, [xField, yField]), fields = _b.fields, formatter = _b.formatter;
  35. (0, base_1.geometry)({
  36. chart: chart,
  37. options: {
  38. type: 'interval',
  39. xField: xField,
  40. yField: constant_1.FUNNEL_MAPPING_VALUE,
  41. colorField: xField,
  42. tooltipFields: (0, util_1.isArray)(fields) && fields.concat([constant_1.FUNNEL_PERCENT, constant_1.FUNNEL_CONVERSATION]),
  43. mapping: {
  44. shape: shape,
  45. tooltip: formatter,
  46. color: color,
  47. style: funnelStyle,
  48. },
  49. label: label,
  50. state: state,
  51. },
  52. });
  53. var geo = (0, utils_1.findGeometry)(params.chart, 'interval');
  54. geo.adjust('symmetric');
  55. return params;
  56. }
  57. /**
  58. * 转置处理
  59. * @param params
  60. */
  61. function transpose(params) {
  62. var chart = params.chart, options = params.options;
  63. var isTransposed = options.isTransposed;
  64. chart.coordinate({
  65. type: 'rect',
  66. actions: !isTransposed ? [['transpose'], ['scale', 1, -1]] : [],
  67. });
  68. return params;
  69. }
  70. /**
  71. * 转化率组件
  72. * @param params
  73. */
  74. function conversionTag(params) {
  75. var options = params.options, chart = params.chart;
  76. var maxSize = options.maxSize;
  77. // 获取形状位置,再转化为需要的转化率位置
  78. var dataArray = (0, util_1.get)(chart, ['geometries', '0', 'dataArray'], []);
  79. var size = (0, util_1.get)(chart, ['options', 'data', 'length']);
  80. var x = (0, util_1.map)(dataArray, function (item) { return (0, util_1.get)(item, ['0', 'nextPoints', '0', 'x']) * size - 0.5; });
  81. var getLineCoordinate = function (datum, datumIndex, data, initLineOption) {
  82. var percent = maxSize - (maxSize - datum[constant_1.FUNNEL_MAPPING_VALUE]) / 2;
  83. return tslib_1.__assign(tslib_1.__assign({}, initLineOption), { start: [x[datumIndex - 1] || datumIndex - 0.5, percent], end: [x[datumIndex - 1] || datumIndex - 0.5, percent + 0.05] });
  84. };
  85. (0, common_1.conversionTagComponent)(getLineCoordinate)(params);
  86. return params;
  87. }
  88. exports.conversionTag = conversionTag;
  89. /**
  90. * 基础漏斗
  91. * @param chart
  92. * @param options
  93. */
  94. function basicFunnel(params) {
  95. return (0, utils_1.flow)(field, geometry, transpose, conversionTag)(params);
  96. }
  97. exports.basicFunnel = basicFunnel;
  98. //# sourceMappingURL=basic.js.map