@easyv/charts 1.4.16 → 1.4.18
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/.husky/commit-msg +1 -1
- package/lib/components/AnimateData.js +16 -8
- package/lib/components/Axis.js +128 -82
- package/lib/components/Background.js +24 -16
- package/lib/components/Band.js +89 -62
- package/lib/components/BaseLine.js +41 -29
- package/lib/components/Brush.js +46 -29
- package/lib/components/Carousel.js +40 -13
- package/lib/components/CartesianChart.js +98 -78
- package/lib/components/Chart.js +36 -23
- package/lib/components/ChartContainer.js +27 -18
- package/lib/components/ConicalGradient.js +68 -35
- package/lib/components/ExtentData.js +17 -9
- package/lib/components/FilterData.js +27 -16
- package/lib/components/Indicator.js +8 -6
- package/lib/components/Label.js +123 -83
- package/lib/components/Legend.js +66 -41
- package/lib/components/Lighter.js +48 -19
- package/lib/components/Line.js +59 -39
- package/lib/components/LinearGradient.js +20 -14
- package/lib/components/Mapping.js +34 -9
- package/lib/components/Marquee.js +30 -14
- package/lib/components/PieChart.js +400 -306
- package/lib/components/StackData.js +18 -8
- package/lib/components/StereoBar.js +105 -65
- package/lib/components/TextOverflow.js +25 -9
- package/lib/components/Tooltip.js +55 -41
- package/lib/components/index.js +27 -0
- package/lib/context/index.js +2 -0
- 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 +8 -0
- package/lib/hooks/useAnimateData.js +16 -3
- package/lib/hooks/useAxes.js +115 -65
- package/lib/hooks/useCarouselAxisX.js +56 -26
- package/lib/hooks/useExtentData.js +46 -14
- package/lib/hooks/useFilterData.js +29 -8
- package/lib/hooks/useStackData.js +30 -7
- package/lib/hooks/useTooltip.js +43 -26
- package/lib/index.js +15 -0
- package/lib/utils/index.js +247 -95
- package/package.json +1 -1
- package/src/components/CartesianChart.js +6 -6
- package/src/components/Label.js +8 -2
- package/src/components/TextOverflow.tsx +4 -1
package/lib/components/Band.js
CHANGED
|
@@ -1,23 +1,34 @@
|
|
|
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 _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
13
|
+
|
|
10
14
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
15
|
+
|
|
11
16
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
17
|
+
|
|
12
18
|
var _react = _interopRequireWildcard(require("react"));
|
|
19
|
+
|
|
13
20
|
var _d3v = require("d3v7");
|
|
21
|
+
|
|
14
22
|
var _utils = require("../utils");
|
|
23
|
+
|
|
15
24
|
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); }
|
|
25
|
+
|
|
16
26
|
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; }
|
|
27
|
+
|
|
17
28
|
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; }
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
29
|
+
|
|
30
|
+
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; }
|
|
31
|
+
|
|
21
32
|
var getHighlightData = function getHighlightData(data, extent) {
|
|
22
33
|
switch (extent) {
|
|
23
34
|
case "min":
|
|
@@ -29,6 +40,7 @@ var getHighlightData = function getHighlightData(data, extent) {
|
|
|
29
40
|
flag: minData == item.data.y ? "min" : ""
|
|
30
41
|
});
|
|
31
42
|
});
|
|
43
|
+
|
|
32
44
|
case "max":
|
|
33
45
|
var maxData = (0, _d3v.max)(data, function (d) {
|
|
34
46
|
return d.data.y;
|
|
@@ -38,16 +50,18 @@ var getHighlightData = function getHighlightData(data, extent) {
|
|
|
38
50
|
flag: maxData == item.data.y ? "max" : ""
|
|
39
51
|
});
|
|
40
52
|
});
|
|
53
|
+
|
|
41
54
|
default:
|
|
42
55
|
return data;
|
|
43
56
|
}
|
|
44
57
|
};
|
|
58
|
+
|
|
45
59
|
var getAttr = function getAttr(_ref) {
|
|
46
60
|
var isVertical = _ref.isVertical,
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
61
|
+
seriesWidth = _ref.seriesWidth,
|
|
62
|
+
length = _ref.length,
|
|
63
|
+
x = _ref.x,
|
|
64
|
+
y = _ref.y;
|
|
51
65
|
if (isVertical) return {
|
|
52
66
|
width: length,
|
|
53
67
|
height: seriesWidth,
|
|
@@ -61,73 +75,79 @@ var getAttr = function getAttr(_ref) {
|
|
|
61
75
|
height: length
|
|
62
76
|
};
|
|
63
77
|
};
|
|
78
|
+
|
|
64
79
|
var getBorderRadius = function getBorderRadius(_ref2) {
|
|
65
80
|
var isVertical = _ref2.isVertical,
|
|
66
|
-
|
|
67
|
-
|
|
81
|
+
positive = _ref2.positive,
|
|
82
|
+
seriesWidth = _ref2.seriesWidth;
|
|
68
83
|
return isVertical ? positive ? "0px " + seriesWidth + "px " + seriesWidth + "px 0" : seriesWidth + "px 0 0 " + seriesWidth + "px" : positive ? seriesWidth / 2 + "px " + seriesWidth / 2 + "px 0 0" : "0 0 " + seriesWidth / 2 + "px " + seriesWidth / 2 + "px";
|
|
69
84
|
};
|
|
85
|
+
|
|
70
86
|
var _default = /*#__PURE__*/(0, _react.memo)(function (_ref3) {
|
|
71
87
|
var triggerClick = _ref3.triggerClick,
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
88
|
+
_ref3$config = _ref3.config,
|
|
89
|
+
_ref3$config$pattern = _ref3$config.pattern,
|
|
90
|
+
pattern = _ref3$config$pattern === void 0 ? {} : _ref3$config$pattern,
|
|
91
|
+
_ref3$config$seriesIn = _ref3$config.seriesIntervalWidth,
|
|
92
|
+
paddingInner = _ref3$config$seriesIn === void 0 ? 0 : _ref3$config$seriesIn,
|
|
93
|
+
_ref3$config$paddingI = _ref3$config.paddingInner,
|
|
94
|
+
paddingOuter = _ref3$config$paddingI === void 0 ? 0 : _ref3$config$paddingI,
|
|
95
|
+
style = _ref3$config.style,
|
|
96
|
+
fillType = _ref3$config.fillType,
|
|
97
|
+
url = _ref3$config.url,
|
|
98
|
+
size = _ref3$config.size,
|
|
99
|
+
fill = _ref3$config.fill,
|
|
100
|
+
border = _ref3$config.border,
|
|
101
|
+
opacity = _ref3$config.opacity,
|
|
102
|
+
_ref3$config$highligh = _ref3$config.highlight,
|
|
103
|
+
showHighlight = _ref3$config$highligh.show,
|
|
104
|
+
extent = _ref3$config$highligh.extent,
|
|
105
|
+
highlightFill = _ref3$config$highligh.fill,
|
|
106
|
+
headDecorate = _ref3$config.headDecorate,
|
|
107
|
+
_ref3$bandLength = _ref3.bandLength,
|
|
108
|
+
bandLength = _ref3$bandLength === void 0 ? 0 : _ref3$bandLength,
|
|
109
|
+
data = _ref3.data,
|
|
110
|
+
_ref3$xAxis = _ref3.xAxis,
|
|
111
|
+
xScaler = _ref3$xAxis.scaler,
|
|
112
|
+
step = _ref3$xAxis.step,
|
|
113
|
+
direction = _ref3$xAxis.direction,
|
|
114
|
+
_ref3$yAxis = _ref3.yAxis,
|
|
115
|
+
yScaler = _ref3$yAxis.scaler,
|
|
116
|
+
isClipAxis = _ref3$yAxis.isClipAxis,
|
|
117
|
+
clipValue = _ref3$yAxis.clipValue;
|
|
102
118
|
if (!data.length) return null;
|
|
119
|
+
|
|
103
120
|
var _getSeriesInfo = (0, _utils.getSeriesInfo)({
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
121
|
+
step: step,
|
|
122
|
+
bandLength: bandLength,
|
|
123
|
+
paddingInner: paddingInner,
|
|
124
|
+
paddingOuter: paddingOuter
|
|
125
|
+
}),
|
|
126
|
+
seriesWidth = _getSeriesInfo.seriesWidth,
|
|
127
|
+
seriesStep = _getSeriesInfo.seriesStep,
|
|
128
|
+
seriesStart = _getSeriesInfo.seriesStart;
|
|
129
|
+
|
|
112
130
|
var _data = showHighlight ? getHighlightData(data, extent) : data;
|
|
131
|
+
|
|
113
132
|
var isVertical = direction === "vertical";
|
|
114
133
|
var borderStr = "".concat(border.borderColor, " solid ").concat(border.borderWidth, "px");
|
|
115
134
|
return /*#__PURE__*/_react["default"].createElement("g", {
|
|
116
135
|
className: "__easyv-band"
|
|
117
136
|
}, _data.map(function (_ref4, i) {
|
|
118
137
|
var flag = _ref4.flag,
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
138
|
+
index = _ref4.index,
|
|
139
|
+
_ref4$bound = (0, _slicedToArray2["default"])(_ref4.bound, 2),
|
|
140
|
+
start = _ref4$bound[0],
|
|
141
|
+
end = _ref4$bound[1],
|
|
142
|
+
data = _ref4.data,
|
|
143
|
+
_ref4$data = _ref4.data,
|
|
144
|
+
x = _ref4$data.x,
|
|
145
|
+
y = _ref4$data.y,
|
|
146
|
+
s = _ref4$data.s;
|
|
147
|
+
|
|
128
148
|
//todo 柱状中空设置
|
|
129
|
-
var y1, y2;
|
|
130
|
-
|
|
149
|
+
var y1, y2; //断轴图相关,断轴图的scaler是一个数组,内含上断轴下断轴的scaler
|
|
150
|
+
|
|
131
151
|
if (isClipAxis) {
|
|
132
152
|
if (end > +clipValue) {
|
|
133
153
|
y1 = yScaler[1](start);
|
|
@@ -140,25 +160,30 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref3) {
|
|
|
140
160
|
y1 = yScaler(isVertical ? end : start);
|
|
141
161
|
y2 = yScaler(isVertical ? start : end);
|
|
142
162
|
}
|
|
163
|
+
|
|
143
164
|
var positionX = xScaler(x) - step / 2 + seriesStart + index * seriesStep;
|
|
144
165
|
var showHead, headUrl, headWidth, headHeight, headTranslate;
|
|
166
|
+
|
|
145
167
|
if (headDecorate) {
|
|
146
168
|
showHead = headDecorate.show, headUrl = headDecorate.url, headWidth = headDecorate.size.width, headHeight = headDecorate.size.height, headTranslate = headDecorate.translate;
|
|
147
|
-
}
|
|
148
|
-
|
|
169
|
+
} //断轴图相关,将柱形在断轴处切开
|
|
170
|
+
|
|
171
|
+
|
|
149
172
|
var setClipPath = function setClipPath() {
|
|
150
173
|
if (isClipAxis && end > +clipValue) {
|
|
151
174
|
var clipValueY2 = yScaler[0](clipValue); //上方
|
|
175
|
+
|
|
152
176
|
var clipValueY1 = yScaler[1](clipValue); //下方
|
|
177
|
+
|
|
153
178
|
var top = Math.abs((y2 - clipValueY2) / (y1 - y2)) * 100;
|
|
154
|
-
var bottom = Math.abs((y2 - clipValueY1) / (y1 - y2)) * 100;
|
|
179
|
+
var bottom = Math.abs((y2 - clipValueY1) / (y1 - y2)) * 100; //clip path属性
|
|
155
180
|
|
|
156
|
-
//clip path属性
|
|
157
181
|
return "polygon(0% 0%, 0% 100%, 0 100%, 0 ".concat(top, "%, 100% ").concat(top, "%, 100% ").concat(bottom, "%, 0 ").concat(bottom, "%, 0 100%, 100% 100%, 100% 0%)");
|
|
158
182
|
} else {
|
|
159
183
|
return "none";
|
|
160
184
|
}
|
|
161
185
|
};
|
|
186
|
+
|
|
162
187
|
if (isNaN(positionX)) return null;
|
|
163
188
|
var positionY = y < 0 ? y1 : y2;
|
|
164
189
|
var attr = getAttr({
|
|
@@ -193,6 +218,7 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref3) {
|
|
|
193
218
|
style: _objectSpread({
|
|
194
219
|
width: "100%",
|
|
195
220
|
height: "100%",
|
|
221
|
+
|
|
196
222
|
/** Safari Bug **/
|
|
197
223
|
position: "fixed",
|
|
198
224
|
clipPath: setClipPath(),
|
|
@@ -215,4 +241,5 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref3) {
|
|
|
215
241
|
}));
|
|
216
242
|
}));
|
|
217
243
|
});
|
|
244
|
+
|
|
218
245
|
exports["default"] = _default;
|
|
@@ -1,50 +1,60 @@
|
|
|
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 _react = _interopRequireWildcard(require("react"));
|
|
15
|
+
|
|
11
16
|
var _utils = require("../utils");
|
|
17
|
+
|
|
12
18
|
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); }
|
|
19
|
+
|
|
13
20
|
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; }
|
|
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 width = _ref.width,
|
|
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
|
-
|
|
28
|
+
height = _ref.height,
|
|
29
|
+
orientation = _ref.baseLineOri,
|
|
30
|
+
_ref$config = _ref.config,
|
|
31
|
+
_ref$config$dataStyle = _ref$config.dataStyle,
|
|
32
|
+
_ref$config$dataStyle2 = _ref$config$dataStyle.data,
|
|
33
|
+
dataShow = _ref$config$dataStyle2.show,
|
|
34
|
+
dataStyle = _ref$config$dataStyle2.dataStyle,
|
|
35
|
+
dataTranslate = _ref$config$dataStyle2.translate,
|
|
36
|
+
_ref$config$dataStyle3 = _ref$config$dataStyle.label,
|
|
37
|
+
label = _ref$config$dataStyle3.label,
|
|
38
|
+
labelShow = _ref$config$dataStyle3.show,
|
|
39
|
+
textStyle = _ref$config$dataStyle3.textStyle,
|
|
40
|
+
labelTranslate = _ref$config$dataStyle3.translate,
|
|
41
|
+
_ref$config$line = _ref$config.line,
|
|
42
|
+
color = _ref$config$line.color,
|
|
43
|
+
lineType = _ref$config$line.lineType,
|
|
44
|
+
lineWidth = _ref$config$line.lineWidth,
|
|
45
|
+
_ref$config$line$marg = _ref$config$line.margin,
|
|
46
|
+
marginLeft = _ref$config$line$marg.marginLeft,
|
|
47
|
+
marginRight = _ref$config$line$marg.marginRight,
|
|
48
|
+
strokeDasharray = _ref$config$line.strokeDasharray,
|
|
49
|
+
_ref$yAxis = _ref.yAxis,
|
|
50
|
+
yScaler = _ref$yAxis.scaler,
|
|
51
|
+
clipValue = _ref$yAxis.clipValue,
|
|
52
|
+
isClipAxis = _ref$yAxis.isClipAxis,
|
|
53
|
+
data = _ref.data;
|
|
54
|
+
|
|
46
55
|
try {
|
|
47
56
|
var x1, x2, y1, y2;
|
|
57
|
+
|
|
48
58
|
if (isClipAxis) {
|
|
49
59
|
if (data.value > +clipValue) {
|
|
50
60
|
x1 = orientation == 'left' ? yScaler[0](data.value) : marginLeft, x2 = orientation == 'left' ? yScaler[0](data.value) : width - marginRight, y1 = orientation == 'left' ? marginLeft : yScaler[0](data.value), y2 = orientation == 'left' ? height - marginRight : yScaler[0](data.value);
|
|
@@ -54,6 +64,7 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref) {
|
|
|
54
64
|
} else {
|
|
55
65
|
x1 = orientation == 'left' ? yScaler(data.value) : marginLeft, x2 = orientation == 'left' ? yScaler(data.value) : width - marginRight, y1 = orientation == 'left' ? marginLeft : yScaler(data.value), y2 = orientation == 'left' ? height - marginRight : yScaler(data.value);
|
|
56
66
|
}
|
|
67
|
+
|
|
57
68
|
return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("g", {
|
|
58
69
|
className: "__easyv-baseLine"
|
|
59
70
|
}, /*#__PURE__*/_react["default"].createElement("line", {
|
|
@@ -84,4 +95,5 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref) {
|
|
|
84
95
|
return null;
|
|
85
96
|
}
|
|
86
97
|
});
|
|
98
|
+
|
|
87
99
|
exports["default"] = _default;
|
package/lib/components/Brush.js
CHANGED
|
@@ -1,17 +1,22 @@
|
|
|
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 _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
13
|
+
|
|
10
14
|
var _react = require("react");
|
|
15
|
+
|
|
11
16
|
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; }
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
17
|
+
|
|
18
|
+
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; }
|
|
19
|
+
|
|
15
20
|
var left = {
|
|
16
21
|
position: 'relative',
|
|
17
22
|
width: 5,
|
|
@@ -36,57 +41,66 @@ var initialPosition = {
|
|
|
36
41
|
end: 0,
|
|
37
42
|
status: ''
|
|
38
43
|
};
|
|
44
|
+
|
|
39
45
|
var getValue = function getValue(x, min, max) {
|
|
40
46
|
return Math.max(min, Math.min(x, max));
|
|
41
47
|
};
|
|
48
|
+
|
|
42
49
|
var _default = function _default(_ref) {
|
|
43
50
|
var width = _ref.width,
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
51
|
+
_ref$config = _ref.config,
|
|
52
|
+
height = _ref$config.height,
|
|
53
|
+
background = _ref$config.background,
|
|
54
|
+
_ref$config$margin = _ref$config.margin,
|
|
55
|
+
marginLeft = _ref$config$margin.marginLeft,
|
|
56
|
+
marginRight = _ref$config$margin.marginRight,
|
|
57
|
+
_ref$config$detail = _ref$config.detail,
|
|
58
|
+
blockWidth = _ref$config$detail.width,
|
|
59
|
+
color = _ref$config$detail.color;
|
|
60
|
+
|
|
53
61
|
var _useState = (0, _react.useState)({
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
62
|
+
translateX: 0,
|
|
63
|
+
width: blockWidth
|
|
64
|
+
}),
|
|
65
|
+
_useState2 = (0, _slicedToArray2["default"])(_useState, 2),
|
|
66
|
+
state = _useState2[0],
|
|
67
|
+
setState = _useState2[1];
|
|
68
|
+
|
|
60
69
|
var availableWidth = width - marginLeft - marginRight;
|
|
61
70
|
var cache = (0, _react.useRef)(state);
|
|
62
71
|
var move = (0, _react.useCallback)(function (_ref2) {
|
|
63
72
|
var delta = _ref2.delta,
|
|
64
|
-
|
|
65
|
-
|
|
73
|
+
status = _ref2.status,
|
|
74
|
+
name = _ref2.name;
|
|
66
75
|
var _cache$current = cache.current,
|
|
67
|
-
|
|
68
|
-
|
|
76
|
+
width = _cache$current.width,
|
|
77
|
+
translateX = _cache$current.translateX;
|
|
69
78
|
var minWidth = 40;
|
|
70
79
|
var minX = 0;
|
|
80
|
+
|
|
71
81
|
switch (name) {
|
|
72
82
|
case 'center':
|
|
73
83
|
translateX = getValue(translateX + delta, minX, availableWidth - width);
|
|
74
84
|
break;
|
|
85
|
+
|
|
75
86
|
case 'left':
|
|
76
87
|
var tempWidth = width;
|
|
77
88
|
width = getValue(width + delta * -1, minWidth, translateX + width);
|
|
78
89
|
translateX = getValue(translateX + delta, minX, translateX + tempWidth - width);
|
|
79
90
|
break;
|
|
91
|
+
|
|
80
92
|
case 'right':
|
|
81
93
|
width = getValue(width + delta, minWidth, availableWidth - translateX);
|
|
82
94
|
break;
|
|
83
95
|
}
|
|
96
|
+
|
|
84
97
|
if (status === 'up') {
|
|
85
98
|
cache.current = {
|
|
86
99
|
width: width,
|
|
87
100
|
translateX: translateX
|
|
88
101
|
};
|
|
89
102
|
}
|
|
103
|
+
|
|
90
104
|
setState({
|
|
91
105
|
width: width,
|
|
92
106
|
translateX: translateX
|
|
@@ -129,15 +143,18 @@ var _default = function _default(_ref) {
|
|
|
129
143
|
name: "right"
|
|
130
144
|
})));
|
|
131
145
|
};
|
|
146
|
+
|
|
132
147
|
exports["default"] = _default;
|
|
133
148
|
var Move = /*#__PURE__*/(0, _react.memo)(function (_ref3) {
|
|
134
149
|
var style = _ref3.style,
|
|
135
|
-
|
|
136
|
-
|
|
150
|
+
move = _ref3.move,
|
|
151
|
+
name = _ref3.name;
|
|
152
|
+
|
|
137
153
|
var _useState3 = (0, _react.useState)(initialPosition),
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
154
|
+
_useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
|
|
155
|
+
position = _useState4[0],
|
|
156
|
+
setPosition = _useState4[1];
|
|
157
|
+
|
|
141
158
|
var documentOnMouseMove = (0, _react.useCallback)(function (e) {
|
|
142
159
|
// console.log('documentOnMouseMove');
|
|
143
160
|
setPosition(function (position) {
|
|
@@ -170,8 +187,8 @@ var Move = /*#__PURE__*/(0, _react.memo)(function (_ref3) {
|
|
|
170
187
|
}, []);
|
|
171
188
|
(0, _react.useEffect)(function () {
|
|
172
189
|
var start = position.start,
|
|
173
|
-
|
|
174
|
-
|
|
190
|
+
end = position.end,
|
|
191
|
+
status = position.status;
|
|
175
192
|
move({
|
|
176
193
|
delta: end - start,
|
|
177
194
|
status: status,
|
|
@@ -1,23 +1,37 @@
|
|
|
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 _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
13
|
+
|
|
10
14
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
15
|
+
|
|
11
16
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
17
|
+
|
|
12
18
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
19
|
+
|
|
13
20
|
var _react = _interopRequireWildcard(require("react"));
|
|
21
|
+
|
|
14
22
|
var _d3v = require("d3v7");
|
|
23
|
+
|
|
15
24
|
var _excluded = ["animation"],
|
|
16
|
-
|
|
25
|
+
_excluded2 = ["config", "data"];
|
|
26
|
+
|
|
17
27
|
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); }
|
|
28
|
+
|
|
18
29
|
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; }
|
|
30
|
+
|
|
19
31
|
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; }
|
|
32
|
+
|
|
20
33
|
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; }
|
|
34
|
+
|
|
21
35
|
var initialState = {
|
|
22
36
|
currentIndex: null,
|
|
23
37
|
trigger: ''
|
|
@@ -38,24 +52,29 @@ var defaultAnimation = {
|
|
|
38
52
|
/**
|
|
39
53
|
* 饼图类图表轮播逻辑,用来管理currentIndex,及回调逻辑(HOC)
|
|
40
54
|
*/
|
|
55
|
+
|
|
41
56
|
var _default = function _default(Component) {
|
|
42
57
|
return /*#__PURE__*/(0, _react.memo)(function (_ref) {
|
|
43
58
|
var _ref$config = _ref.config,
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
59
|
+
animation = _ref$config.animation,
|
|
60
|
+
config = (0, _objectWithoutProperties2["default"])(_ref$config, _excluded),
|
|
61
|
+
_ref$data = _ref.data,
|
|
62
|
+
data = _ref$data === void 0 ? [] : _ref$data,
|
|
63
|
+
rest = (0, _objectWithoutProperties2["default"])(_ref, _excluded2);
|
|
49
64
|
var dataLength = data.length;
|
|
65
|
+
|
|
50
66
|
var _animation = Object.assign({}, defaultAnimation, animation);
|
|
67
|
+
|
|
51
68
|
var on = _animation.on,
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
69
|
+
interval = _animation.interval,
|
|
70
|
+
interactive = _animation.interactive,
|
|
71
|
+
hoverStop = _animation.hoverStop;
|
|
72
|
+
|
|
55
73
|
var _useState = (0, _react.useState)(on ? carouselState : initialState),
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
74
|
+
_useState2 = (0, _slicedToArray2["default"])(_useState, 2),
|
|
75
|
+
state = _useState2[0],
|
|
76
|
+
setState = _useState2[1];
|
|
77
|
+
|
|
59
78
|
var timer = (0, _react.useRef)(null);
|
|
60
79
|
var hoverState = (0, _react.useRef)(false);
|
|
61
80
|
var animationOn = on && interval && dataLength;
|
|
@@ -91,7 +110,8 @@ var _default = function _default(Component) {
|
|
|
91
110
|
}, [carousel]);
|
|
92
111
|
var onEvent = (0, _react.useCallback)(function (_ref3) {
|
|
93
112
|
var currentIndex = _ref3.currentIndex,
|
|
94
|
-
|
|
113
|
+
type = _ref3.type;
|
|
114
|
+
|
|
95
115
|
switch (interactive) {
|
|
96
116
|
case true:
|
|
97
117
|
case 'click':
|
|
@@ -103,7 +123,9 @@ var _default = function _default(Component) {
|
|
|
103
123
|
currentIndex: currentIndex
|
|
104
124
|
});
|
|
105
125
|
}
|
|
126
|
+
|
|
106
127
|
break;
|
|
128
|
+
|
|
107
129
|
case 'hover':
|
|
108
130
|
if (type == 'onMouseEnter') {
|
|
109
131
|
setState({
|
|
@@ -114,10 +136,13 @@ var _default = function _default(Component) {
|
|
|
114
136
|
} else if (type == 'onMouseLeave') {
|
|
115
137
|
!hoverState.current && animationOn && carousel();
|
|
116
138
|
}
|
|
139
|
+
|
|
117
140
|
break;
|
|
141
|
+
|
|
118
142
|
case false:
|
|
119
143
|
case '':
|
|
120
144
|
break;
|
|
145
|
+
|
|
121
146
|
case 'carousel':
|
|
122
147
|
default:
|
|
123
148
|
setState({
|
|
@@ -134,6 +159,7 @@ var _default = function _default(Component) {
|
|
|
134
159
|
timer.current && timer.current.stop();
|
|
135
160
|
} else {
|
|
136
161
|
hoverState.current = false;
|
|
162
|
+
|
|
137
163
|
if (animationOn) {
|
|
138
164
|
timer.current = (0, _d3v.interval)(function () {
|
|
139
165
|
setState(function (_ref4) {
|
|
@@ -160,4 +186,5 @@ var _default = function _default(Component) {
|
|
|
160
186
|
}));
|
|
161
187
|
});
|
|
162
188
|
};
|
|
189
|
+
|
|
163
190
|
exports["default"] = _default;
|