@easyv/charts 1.4.29 → 1.4.31
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.babelrc +8 -8
- package/.husky/commit-msg +3 -3
- package/CHANGELOG.md +18 -18
- package/commitlint.config.js +1 -1
- package/lib/components/AnimateData.js +16 -8
- package/lib/components/Axis.js +134 -87
- package/lib/components/Background.js +26 -18
- package/lib/components/Band.js +98 -72
- package/lib/components/BaseLine.js +46 -33
- package/lib/components/Brush.js +46 -29
- package/lib/components/Carousel.js +40 -13
- package/lib/components/CartesianChart.js +146 -97
- package/lib/components/Chart.js +39 -26
- package/lib/components/ChartContainer.js +27 -18
- package/lib/components/ConicalGradient.js +89 -56
- package/lib/components/Control.js +28 -12
- package/lib/components/ExtentData.js +17 -9
- package/lib/components/FilterData.js +27 -16
- package/lib/components/Indicator.js +30 -23
- package/lib/components/Label.js +126 -96
- package/lib/components/Legend.js +66 -41
- package/lib/components/Lighter.js +50 -21
- package/lib/components/Line.js +59 -39
- package/lib/components/LinearGradient.js +22 -16
- package/lib/components/Mapping.js +34 -9
- package/lib/components/Marquee.js +30 -14
- package/lib/components/PieChart.js +420 -318
- package/lib/components/StackData.js +18 -8
- package/lib/components/StereoBar.js +105 -65
- package/lib/components/TextOverflow.js +21 -8
- package/lib/components/Tooltip.js +55 -41
- package/lib/components/index.js +29 -0
- package/lib/components/pieTooltip.js +67 -40
- package/lib/context/index.js +2 -0
- package/lib/css/index.module.css +42 -42
- package/lib/css/piechart.module.css +26 -26
- package/lib/element/ConicGradient.js +35 -29
- package/lib/element/Line.js +13 -9
- package/lib/element/index.js +2 -0
- package/lib/formatter/index.js +2 -0
- package/lib/formatter/legend.js +41 -30
- package/lib/hooks/index.js +9 -0
- package/lib/hooks/useAiData.js +20 -12
- package/lib/hooks/useAnimateData.js +21 -8
- package/lib/hooks/useAxes.js +117 -67
- package/lib/hooks/useCarouselAxisX.js +59 -26
- package/lib/hooks/useExtentData.js +47 -15
- package/lib/hooks/useFilterData.js +34 -13
- package/lib/hooks/useStackData.js +35 -12
- package/lib/hooks/useTooltip.js +53 -36
- package/lib/index.js +15 -0
- package/lib/utils/index.js +247 -95
- package/package.json +55 -55
- package/src/components/Axis.tsx +1 -1
- package/src/components/Background.tsx +61 -61
- package/src/components/Band.tsx +274 -274
- package/src/components/Brush.js +159 -159
- package/src/components/CartesianChart.js +1 -0
- package/src/components/Chart.js +100 -101
- package/src/components/ChartContainer.tsx +71 -71
- package/src/components/ConicalGradient.js +258 -258
- package/src/components/Control.jsx +51 -51
- package/src/components/ExtentData.js +17 -17
- package/src/components/Indicator.js +61 -61
- package/src/components/Label.js +275 -275
- package/src/components/Legend.js +165 -165
- package/src/components/Lighter.jsx +173 -173
- package/src/components/Line.js +150 -150
- package/src/components/LinearGradient.js +29 -29
- package/src/components/PieTooltip.jsx +160 -160
- package/src/components/StereoBar.tsx +307 -307
- package/src/components/index.js +59 -59
- package/src/context/index.js +2 -2
- package/src/css/index.module.css +42 -42
- package/src/css/piechart.module.css +26 -26
- package/src/element/ConicGradient.jsx +55 -55
- package/src/element/Line.tsx +33 -33
- package/src/element/index.ts +3 -3
- package/src/formatter/index.js +1 -1
- package/src/formatter/legend.js +92 -92
- package/src/hooks/index.js +20 -20
- package/src/hooks/useAnimateData.ts +67 -67
- package/src/hooks/useExtentData.js +1 -1
- package/src/hooks/useFilterData.js +72 -72
- package/src/hooks/useStackData.js +101 -101
- package/src/hooks/useTooltip.ts +100 -100
- package/src/index.js +6 -6
- package/src/types/index.d.ts +67 -67
- package/src/utils/index.js +757 -757
- package/tsconfig.json +23 -23
|
@@ -1,44 +1,50 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
4
5
|
Object.defineProperty(exports, "__esModule", {
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
7
8
|
exports["default"] = void 0;
|
|
9
|
+
|
|
8
10
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
11
|
+
|
|
9
12
|
var _react = require("react");
|
|
13
|
+
|
|
10
14
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
15
|
+
|
|
16
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
17
|
+
|
|
14
18
|
var _default = function _default(_ref) {
|
|
15
19
|
var color = _ref.color,
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
20
|
+
height = _ref.height,
|
|
21
|
+
width = _ref.width,
|
|
22
|
+
_ref$x = _ref.x,
|
|
23
|
+
x = _ref$x === void 0 ? 0 : _ref$x,
|
|
24
|
+
_ref$y = _ref.y,
|
|
25
|
+
y = _ref$y === void 0 ? 0 : _ref$y,
|
|
26
|
+
_ref$isControlChart = _ref.isControlChart,
|
|
27
|
+
isControlChart = _ref$isControlChart === void 0 ? false : _ref$isControlChart,
|
|
28
|
+
_ref$xName = _ref.xName,
|
|
29
|
+
xName = _ref$xName === void 0 ? null : _ref$xName,
|
|
30
|
+
_ref$setControlChartT = _ref.setControlChartTooltipShow,
|
|
31
|
+
setControlChartTooltipShow = _ref$setControlChartT === void 0 ? null : _ref$setControlChartT,
|
|
32
|
+
_ref$setControlChartT2 = _ref.setControlChartTooltipXName,
|
|
33
|
+
setControlChartTooltipXName = _ref$setControlChartT2 === void 0 ? null : _ref$setControlChartT2,
|
|
34
|
+
_ref$setControlChartT3 = _ref.setControlChartTooltipX,
|
|
35
|
+
setControlChartTooltipX = _ref$setControlChartT3 === void 0 ? null : _ref$setControlChartT3,
|
|
36
|
+
_ref$setControlChartI = _ref.setControlChartIndicatorList,
|
|
37
|
+
setControlChartIndicatorList = _ref$setControlChartI === void 0 ? null : _ref$setControlChartI,
|
|
38
|
+
_ref$controlChartIndi = _ref.controlChartIndicatorList,
|
|
39
|
+
controlChartIndicatorList = _ref$controlChartIndi === void 0 ? null : _ref$controlChartIndi;
|
|
36
40
|
var isShow = true;
|
|
41
|
+
|
|
37
42
|
if (isControlChart && controlChartIndicatorList) {
|
|
38
43
|
isShow = controlChartIndicatorList.find(function (item) {
|
|
39
44
|
return item.tick === xName;
|
|
40
45
|
}).isShow;
|
|
41
46
|
}
|
|
47
|
+
|
|
42
48
|
return /*#__PURE__*/React.createElement("rect", {
|
|
43
49
|
width: width,
|
|
44
50
|
height: height,
|
|
@@ -80,4 +86,5 @@ var _default = function _default(_ref) {
|
|
|
80
86
|
stroke: "none"
|
|
81
87
|
});
|
|
82
88
|
};
|
|
89
|
+
|
|
83
90
|
exports["default"] = _default;
|
package/lib/components/Label.js
CHANGED
|
@@ -1,81 +1,95 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
4
5
|
Object.defineProperty(exports, "__esModule", {
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
7
8
|
exports["default"] = void 0;
|
|
9
|
+
|
|
8
10
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
11
|
+
|
|
9
12
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
13
|
+
|
|
10
14
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
15
|
+
|
|
11
16
|
var _react = require("react");
|
|
17
|
+
|
|
12
18
|
var _utils = require("../utils");
|
|
19
|
+
|
|
13
20
|
var _context = require("../context");
|
|
21
|
+
|
|
14
22
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
23
|
+
|
|
24
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
25
|
+
|
|
18
26
|
var _default = /*#__PURE__*/(0, _react.memo)(function (_ref) {
|
|
19
27
|
var _ref$config = _ref.config,
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
28
|
+
_ref$config$seriesInt = _ref$config.seriesIntervalWidth,
|
|
29
|
+
paddingInner = _ref$config$seriesInt === void 0 ? 0 : _ref$config$seriesInt,
|
|
30
|
+
_ref$config$paddingIn = _ref$config.paddingInner,
|
|
31
|
+
paddingOuter = _ref$config$paddingIn === void 0 ? 0 : _ref$config$paddingIn,
|
|
32
|
+
label = _ref$config.label,
|
|
33
|
+
icon = _ref$config.icon,
|
|
34
|
+
config = _ref.config,
|
|
35
|
+
_ref$bandLength = _ref.bandLength,
|
|
36
|
+
bandLength = _ref$bandLength === void 0 ? 0 : _ref$bandLength,
|
|
37
|
+
data = _ref.data,
|
|
38
|
+
_ref$xAxis = _ref.xAxis,
|
|
39
|
+
xScaler = _ref$xAxis.scaler,
|
|
40
|
+
step = _ref$xAxis.step,
|
|
41
|
+
direction = _ref$xAxis.direction,
|
|
42
|
+
_ref$yAxis = _ref.yAxis,
|
|
43
|
+
yScaler = _ref$yAxis.scaler,
|
|
44
|
+
isClipAxis = _ref$yAxis.isClipAxis,
|
|
45
|
+
clipValue = _ref$yAxis.clipValue,
|
|
46
|
+
triggerClick = _ref.triggerClick,
|
|
47
|
+
indicatorWidth = _ref.indicatorWidth,
|
|
48
|
+
setControlChartTooltipShow = _ref.setControlChartTooltipShow,
|
|
49
|
+
setControlChartTooltipX = _ref.setControlChartTooltipX,
|
|
50
|
+
setControlChartTooltipXName = _ref.setControlChartTooltipXName,
|
|
51
|
+
_ref$isControlChart = _ref.isControlChart,
|
|
52
|
+
isControlChart = _ref$isControlChart === void 0 ? false : _ref$isControlChart,
|
|
53
|
+
_ref$setControlChartI = _ref.setControlChartIndicatorList,
|
|
54
|
+
setControlChartIndicatorList = _ref$setControlChartI === void 0 ? null : _ref$setControlChartI;
|
|
47
55
|
var lineType = config.hasOwnProperty("line"); // 堆叠处理
|
|
56
|
+
|
|
48
57
|
var showIcon = icon && icon.show;
|
|
49
58
|
var showLabel = label && label.show;
|
|
50
59
|
if (!(data.length && (showIcon || showLabel))) return null;
|
|
60
|
+
|
|
51
61
|
var _useContext = (0, _react.useContext)(_context.chartContext),
|
|
52
|
-
|
|
53
|
-
|
|
62
|
+
width = _useContext.width,
|
|
63
|
+
height = _useContext.height;
|
|
64
|
+
|
|
54
65
|
var _getSeriesInfo = (0, _utils.getSeriesInfo)({
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
66
|
+
step: step,
|
|
67
|
+
bandLength: bandLength,
|
|
68
|
+
paddingInner: paddingInner,
|
|
69
|
+
paddingOuter: paddingOuter
|
|
70
|
+
}),
|
|
71
|
+
seriesStep = _getSeriesInfo.seriesStep,
|
|
72
|
+
seriesWidth = _getSeriesInfo.seriesWidth,
|
|
73
|
+
seriesStart = _getSeriesInfo.seriesStart;
|
|
74
|
+
|
|
63
75
|
var isVertical = direction === "vertical";
|
|
64
76
|
var _position = label.position;
|
|
65
77
|
return /*#__PURE__*/React.createElement("g", {
|
|
66
78
|
className: "__easyv-label"
|
|
67
79
|
}, data.map(function (_ref2, i) {
|
|
68
80
|
var index = _ref2.index,
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
81
|
+
_ref2$bound = (0, _slicedToArray2["default"])(_ref2.bound, 2),
|
|
82
|
+
start = _ref2$bound[0],
|
|
83
|
+
end = _ref2$bound[1],
|
|
84
|
+
data = _ref2.data,
|
|
85
|
+
_ref2$data = _ref2.data,
|
|
86
|
+
x = _ref2$data.x,
|
|
87
|
+
y = _ref2$data.y,
|
|
88
|
+
showY = _ref2$data.showY,
|
|
89
|
+
s = _ref2$data.s;
|
|
90
|
+
|
|
78
91
|
var y1, y2;
|
|
92
|
+
|
|
79
93
|
if (isClipAxis) {
|
|
80
94
|
if (end > +clipValue) {
|
|
81
95
|
y1 = yScaler[1](start);
|
|
@@ -85,12 +99,12 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref) {
|
|
|
85
99
|
y2 = yScaler[1](end);
|
|
86
100
|
}
|
|
87
101
|
} else {
|
|
88
|
-
y1 = yScaler(isVertical ? end : start);
|
|
89
|
-
|
|
102
|
+
y1 = yScaler(isVertical ? end : start); // 处理z型折线图和堆叠柱图的逻辑冲突
|
|
103
|
+
|
|
90
104
|
y2 = lineType ? start ? yScaler(isVertical ? start : end - start) : yScaler(isVertical ? start : end) : yScaler(isVertical ? start : end);
|
|
91
|
-
}
|
|
105
|
+
} // const y2 = yScaler(isVertical ? start : end);
|
|
106
|
+
|
|
92
107
|
|
|
93
|
-
// const y2 = yScaler(isVertical ? start : end);
|
|
94
108
|
var positionX = xScaler(x) - step / 2 + seriesStart + index * seriesStep;
|
|
95
109
|
if (isNaN(positionX)) return null;
|
|
96
110
|
var position = positionX + (config.line ? step : seriesWidth) / 2;
|
|
@@ -163,28 +177,30 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref) {
|
|
|
163
177
|
}, attr)));
|
|
164
178
|
}));
|
|
165
179
|
});
|
|
180
|
+
|
|
166
181
|
exports["default"] = _default;
|
|
182
|
+
|
|
167
183
|
var Label = function Label(_ref3) {
|
|
168
184
|
var x = _ref3.x,
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
185
|
+
y = _ref3.y,
|
|
186
|
+
value = _ref3.value,
|
|
187
|
+
_ref3$config = _ref3.config,
|
|
188
|
+
font = _ref3$config.font,
|
|
189
|
+
_ref3$config$translat = _ref3$config.translate,
|
|
190
|
+
_ref3$config$translat2 = _ref3$config$translat.x,
|
|
191
|
+
translateX = _ref3$config$translat2 === void 0 ? 0 : _ref3$config$translat2,
|
|
192
|
+
_ref3$config$translat3 = _ref3$config$translat.y,
|
|
193
|
+
translateY = _ref3$config$translat3 === void 0 ? 0 : _ref3$config$translat3,
|
|
194
|
+
_ref3$config$suffix = _ref3$config.suffix,
|
|
195
|
+
content = _ref3$config$suffix.content,
|
|
196
|
+
suffixFont = _ref3$config$suffix.font,
|
|
197
|
+
_ref3$config$suffix$t = _ref3$config$suffix.translate,
|
|
198
|
+
suffixX = _ref3$config$suffix$t.x,
|
|
199
|
+
suffixY = _ref3$config$suffix$t.y,
|
|
200
|
+
_ref3$textAnchor = _ref3.textAnchor,
|
|
201
|
+
textAnchor = _ref3$textAnchor === void 0 ? "middle" : _ref3$textAnchor,
|
|
202
|
+
_ref3$dominantBaselin = _ref3.dominantBaseline,
|
|
203
|
+
dominantBaseline = _ref3$dominantBaselin === void 0 ? "middle" : _ref3$dominantBaselin;
|
|
188
204
|
return /*#__PURE__*/React.createElement("text", (0, _extends2["default"])({
|
|
189
205
|
x: x,
|
|
190
206
|
y: y,
|
|
@@ -200,19 +216,20 @@ var Label = function Label(_ref3) {
|
|
|
200
216
|
style: _objectSpread({}, (0, _utils.getFontStyle)(suffixFont, "svg"))
|
|
201
217
|
}, content));
|
|
202
218
|
};
|
|
219
|
+
|
|
203
220
|
var Icon = function Icon(_ref4) {
|
|
204
221
|
var cx = _ref4.cx,
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
222
|
+
cy = _ref4.cy,
|
|
223
|
+
_ref4$config = _ref4.config,
|
|
224
|
+
mode = _ref4$config.mode,
|
|
225
|
+
inner = _ref4$config.inner,
|
|
226
|
+
outer = _ref4$config.outer,
|
|
227
|
+
color = _ref4$config.color,
|
|
228
|
+
radius = _ref4$config.radius,
|
|
229
|
+
image = _ref4$config.image,
|
|
230
|
+
_ref4$config$size = _ref4$config.size,
|
|
231
|
+
width = _ref4$config$size.width,
|
|
232
|
+
height = _ref4$config$size.height;
|
|
216
233
|
return mode == "single" ? /*#__PURE__*/React.createElement(Circle, {
|
|
217
234
|
cx: cx,
|
|
218
235
|
cy: cy,
|
|
@@ -232,11 +249,12 @@ var Icon = function Icon(_ref4) {
|
|
|
232
249
|
xlinkHref: window.appConfig.ASSETS_URL + image
|
|
233
250
|
}));
|
|
234
251
|
};
|
|
252
|
+
|
|
235
253
|
var Circle = function Circle(_ref5) {
|
|
236
254
|
var cx = _ref5.cx,
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
255
|
+
cy = _ref5.cy,
|
|
256
|
+
color = _ref5.color,
|
|
257
|
+
radius = _ref5.radius;
|
|
240
258
|
return /*#__PURE__*/React.createElement("circle", {
|
|
241
259
|
cx: cx,
|
|
242
260
|
cy: cy,
|
|
@@ -245,34 +263,40 @@ var Circle = function Circle(_ref5) {
|
|
|
245
263
|
stroke: "none"
|
|
246
264
|
});
|
|
247
265
|
};
|
|
266
|
+
|
|
248
267
|
var getVerticalLabel = function getVerticalLabel(_ref6) {
|
|
249
268
|
var _ref6$position = _ref6.position,
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
269
|
+
position = _ref6$position === void 0 ? "outerStart" : _ref6$position,
|
|
270
|
+
width = _ref6.width,
|
|
271
|
+
y = _ref6.y,
|
|
272
|
+
y1 = _ref6.y1,
|
|
273
|
+
y2 = _ref6.y2;
|
|
274
|
+
|
|
255
275
|
switch (position) {
|
|
256
276
|
case "start":
|
|
257
277
|
return {
|
|
258
278
|
x: y > 0 ? y2 : y1,
|
|
259
279
|
textAnchor: "start"
|
|
260
280
|
};
|
|
281
|
+
|
|
261
282
|
case "middle":
|
|
262
283
|
return {
|
|
263
284
|
x: (y1 + y2) / 2,
|
|
264
285
|
textAnchor: "middle"
|
|
265
286
|
};
|
|
287
|
+
|
|
266
288
|
case "end":
|
|
267
289
|
return {
|
|
268
290
|
x: y > 0 ? y1 : y2,
|
|
269
291
|
textAnchor: "end"
|
|
270
292
|
};
|
|
293
|
+
|
|
271
294
|
case "outerStart":
|
|
272
295
|
return {
|
|
273
296
|
x: y1,
|
|
274
297
|
textAnchor: y > 0 ? "start" : "end"
|
|
275
298
|
};
|
|
299
|
+
|
|
276
300
|
case "chartStart":
|
|
277
301
|
return {
|
|
278
302
|
x: y > 0 ? width : 0,
|
|
@@ -280,34 +304,40 @@ var getVerticalLabel = function getVerticalLabel(_ref6) {
|
|
|
280
304
|
};
|
|
281
305
|
}
|
|
282
306
|
};
|
|
307
|
+
|
|
283
308
|
var getHorizontalLabel = function getHorizontalLabel(_ref7) {
|
|
284
309
|
var _ref7$position = _ref7.position,
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
310
|
+
position = _ref7$position === void 0 ? "outerStart" : _ref7$position,
|
|
311
|
+
height = _ref7.height,
|
|
312
|
+
y = _ref7.y,
|
|
313
|
+
y1 = _ref7.y1,
|
|
314
|
+
y2 = _ref7.y2;
|
|
315
|
+
|
|
290
316
|
switch (position) {
|
|
291
317
|
case "start":
|
|
292
318
|
return {
|
|
293
319
|
y: y > 0 ? y1 : y2,
|
|
294
320
|
dominantBaseline: "text-after-edge"
|
|
295
321
|
};
|
|
322
|
+
|
|
296
323
|
case "middle":
|
|
297
324
|
return {
|
|
298
325
|
y: (y1 + y2) / 2,
|
|
299
326
|
dominantBaseline: "middle"
|
|
300
327
|
};
|
|
328
|
+
|
|
301
329
|
case "end":
|
|
302
330
|
return {
|
|
303
331
|
y: y > 0 ? y2 : y1,
|
|
304
332
|
dominantBaseline: "text-before-edge"
|
|
305
333
|
};
|
|
334
|
+
|
|
306
335
|
case "outerStart":
|
|
307
336
|
return {
|
|
308
337
|
y: y2,
|
|
309
338
|
dominantBaseline: y >= 0 ? "text-after-edge" : "text-before-edge"
|
|
310
339
|
};
|
|
340
|
+
|
|
311
341
|
case "chartStart":
|
|
312
342
|
return {
|
|
313
343
|
y: y > 0 ? 0 : height,
|
package/lib/components/Legend.js
CHANGED
|
@@ -1,79 +1,96 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
4
5
|
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
|
+
|
|
5
7
|
Object.defineProperty(exports, "__esModule", {
|
|
6
8
|
value: true
|
|
7
9
|
});
|
|
8
10
|
exports["default"] = void 0;
|
|
11
|
+
|
|
9
12
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
13
|
+
|
|
10
14
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
15
|
+
|
|
11
16
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
17
|
+
|
|
12
18
|
var _react = _interopRequireWildcard(require("react"));
|
|
19
|
+
|
|
13
20
|
var _utils = require("../utils");
|
|
21
|
+
|
|
14
22
|
var _TextOverflow = _interopRequireDefault(require("./TextOverflow"));
|
|
23
|
+
|
|
15
24
|
var _excluded = ["italic", "bold"];
|
|
16
|
-
|
|
17
|
-
* 图例
|
|
18
|
-
*/
|
|
25
|
+
|
|
19
26
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
27
|
+
|
|
20
28
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
29
|
+
|
|
21
30
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
31
|
+
|
|
22
32
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
33
|
+
|
|
23
34
|
var defaultFont = {
|
|
24
35
|
fontStyle: 'normal',
|
|
25
36
|
fontWeight: 'normal'
|
|
26
37
|
};
|
|
38
|
+
|
|
27
39
|
var _default = /*#__PURE__*/(0, _react.memo)(function (_ref) {
|
|
28
40
|
var series = _ref.series,
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
41
|
+
config = _ref.config,
|
|
42
|
+
_ref$config = _ref.config,
|
|
43
|
+
show = _ref$config.show,
|
|
44
|
+
_ref$config$order = _ref$config.order,
|
|
45
|
+
order = _ref$config$order === void 0 ? '' : _ref$config$order,
|
|
46
|
+
interactive = _ref$config.interactive,
|
|
47
|
+
maxWidth = _ref$config.maxWidth,
|
|
48
|
+
textOverflow = _ref$config.textOverflow,
|
|
49
|
+
speed = _ref$config.speed,
|
|
50
|
+
_ref$config$layout = _ref$config.layout,
|
|
51
|
+
_ref$config$layout$al = _ref$config$layout.alignment,
|
|
52
|
+
alignment = _ref$config$layout$al === void 0 ? 'right center' : _ref$config$layout$al,
|
|
53
|
+
gridTemplateColumns = _ref$config$layout.gridTemplateColumns,
|
|
54
|
+
_ref$config$layout$gr = _ref$config$layout.gridGap,
|
|
55
|
+
gridColumnGap = _ref$config$layout$gr.gridColumnGap,
|
|
56
|
+
gridRowGap = _ref$config$layout$gr.gridRowGap,
|
|
57
|
+
_ref$config$layout$tr = _ref$config$layout.translate,
|
|
58
|
+
x = _ref$config$layout$tr.x,
|
|
59
|
+
y = _ref$config$layout$tr.y,
|
|
60
|
+
_ref$config$font = _ref$config.font;
|
|
61
|
+
_ref$config$font = _ref$config$font === void 0 ? defaultFont : _ref$config$font;
|
|
62
|
+
var italic = _ref$config$font.italic,
|
|
63
|
+
bold = _ref$config$font.bold,
|
|
64
|
+
font = (0, _objectWithoutProperties2["default"])(_ref$config$font, _excluded),
|
|
65
|
+
_ref$config$unselect = _ref$config.unselect;
|
|
66
|
+
_ref$config$unselect = _ref$config$unselect === void 0 ? {} : _ref$config$unselect;
|
|
67
|
+
var _ref$config$unselect$ = _ref$config$unselect.opacity,
|
|
68
|
+
opacity = _ref$config$unselect$ === void 0 ? 1 : _ref$config$unselect$,
|
|
69
|
+
filterData = _ref.filterData,
|
|
70
|
+
formatter = _ref.formatter,
|
|
71
|
+
judge = _ref.judge;
|
|
60
72
|
if (!show) return null;
|
|
73
|
+
|
|
61
74
|
var _series = (0, _utils.sortPie)(series, order);
|
|
75
|
+
|
|
62
76
|
var _alignment$split = alignment.split(' '),
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
77
|
+
_alignment$split2 = (0, _slicedToArray2["default"])(_alignment$split, 2),
|
|
78
|
+
_alignment = _alignment$split2[0],
|
|
79
|
+
position = _alignment$split2[1];
|
|
80
|
+
|
|
66
81
|
var length = _series.length;
|
|
67
82
|
var onClick = (0, _react.useCallback)(function (e) {
|
|
68
83
|
var dataset = e.currentTarget.dataset;
|
|
69
84
|
var name = dataset.name;
|
|
70
85
|
filterData && interactive && filterData(name);
|
|
71
86
|
}, [interactive, filterData]);
|
|
87
|
+
|
|
72
88
|
if (judge == 0) {
|
|
73
89
|
_series.forEach(function (d) {
|
|
74
90
|
d.percent = 0;
|
|
75
91
|
});
|
|
76
92
|
}
|
|
93
|
+
|
|
77
94
|
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
78
95
|
className: "__easyv-legend-wrapper",
|
|
79
96
|
style: _objectSpread({
|
|
@@ -90,12 +107,15 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref) {
|
|
|
90
107
|
}
|
|
91
108
|
}, _series.map(function (series, index) {
|
|
92
109
|
var _series$config, _series$config$line;
|
|
110
|
+
|
|
93
111
|
var type = series.type,
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
112
|
+
name = series.name,
|
|
113
|
+
displayName = series.displayName,
|
|
114
|
+
icon = series.icon,
|
|
115
|
+
selected = series.selected;
|
|
116
|
+
|
|
98
117
|
var _icon = (0, _utils.getIcon)(type, icon, series === null || series === void 0 ? void 0 : (_series$config = series.config) === null || _series$config === void 0 ? void 0 : (_series$config$line = _series$config.line) === null || _series$config$line === void 0 ? void 0 : _series$config$line.type);
|
|
118
|
+
|
|
99
119
|
return /*#__PURE__*/_react["default"].createElement("li", {
|
|
100
120
|
key: index,
|
|
101
121
|
onClick: onClick,
|
|
@@ -120,7 +140,9 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref) {
|
|
|
120
140
|
})));
|
|
121
141
|
})));
|
|
122
142
|
});
|
|
143
|
+
|
|
123
144
|
exports["default"] = _default;
|
|
145
|
+
|
|
124
146
|
var getPosition = function getPosition(position, alignment) {
|
|
125
147
|
switch (position) {
|
|
126
148
|
case 'top':
|
|
@@ -130,6 +152,7 @@ var getPosition = function getPosition(position, alignment) {
|
|
|
130
152
|
top: 5,
|
|
131
153
|
justifyContent: alignment === 'center' ? 'center' : alignment === 'left' ? 'flex-start' : 'flex-end'
|
|
132
154
|
};
|
|
155
|
+
|
|
133
156
|
case 'right':
|
|
134
157
|
return {
|
|
135
158
|
top: 0,
|
|
@@ -137,6 +160,7 @@ var getPosition = function getPosition(position, alignment) {
|
|
|
137
160
|
right: 10,
|
|
138
161
|
alignItems: alignment === 'center' ? 'center' : alignment === 'left' ? 'flex-start' : 'flex-end'
|
|
139
162
|
};
|
|
163
|
+
|
|
140
164
|
case 'left':
|
|
141
165
|
return {
|
|
142
166
|
top: 0,
|
|
@@ -144,6 +168,7 @@ var getPosition = function getPosition(position, alignment) {
|
|
|
144
168
|
left: 10,
|
|
145
169
|
alignItems: alignment === 'center' ? 'center' : alignment === 'left' ? 'flex-start' : 'flex-end'
|
|
146
170
|
};
|
|
171
|
+
|
|
147
172
|
default:
|
|
148
173
|
return {
|
|
149
174
|
left: 0,
|