@easyv/charts 1.4.25 → 1.4.28
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 +8 -16
- package/lib/components/Axis.js +86 -133
- package/lib/components/Background.js +18 -26
- package/lib/components/Band.js +72 -98
- package/lib/components/BaseLine.js +33 -46
- package/lib/components/Brush.js +29 -46
- package/lib/components/Carousel.js +13 -40
- package/lib/components/CartesianChart.js +98 -146
- package/lib/components/Chart.js +23 -36
- package/lib/components/ChartContainer.js +18 -27
- package/lib/components/ConicalGradient.js +56 -89
- package/lib/components/Control.js +12 -28
- package/lib/components/ExtentData.js +9 -17
- package/lib/components/FilterData.js +16 -27
- package/lib/components/Indicator.js +23 -30
- package/lib/components/Label.js +96 -126
- package/lib/components/Legend.js +41 -66
- package/lib/components/Lighter.js +21 -50
- package/lib/components/Line.js +39 -59
- package/lib/components/LinearGradient.js +16 -22
- package/lib/components/Mapping.js +9 -34
- package/lib/components/Marquee.js +14 -30
- package/lib/components/PieChart.js +468 -489
- package/lib/components/StackData.js +8 -18
- package/lib/components/StereoBar.js +65 -105
- package/lib/components/TextOverflow.js +8 -21
- package/lib/components/Tooltip.js +41 -55
- package/lib/components/index.js +7 -28
- package/lib/components/pieTooltip.js +133 -0
- package/lib/context/index.js +0 -2
- package/lib/css/index.module.css +42 -42
- package/lib/css/piechart.module.css +26 -26
- package/lib/element/ConicGradient.js +29 -35
- package/lib/element/Line.js +9 -13
- package/lib/element/index.js +0 -2
- package/lib/formatter/index.js +0 -2
- package/lib/formatter/legend.js +30 -41
- package/lib/hooks/index.js +0 -9
- package/lib/hooks/useAiData.js +12 -20
- package/lib/hooks/useAnimateData.js +8 -21
- package/lib/hooks/useAxes.js +67 -117
- package/lib/hooks/useCarouselAxisX.js +27 -60
- package/lib/hooks/useExtentData.js +14 -46
- package/lib/hooks/useFilterData.js +13 -34
- package/lib/hooks/useStackData.js +12 -35
- package/lib/hooks/useTooltip.js +36 -53
- package/lib/index.js +0 -15
- package/lib/utils/index.js +95 -247
- package/package.json +55 -55
- 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 -1
- package/src/components/Chart.js +99 -99
- 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/Marquee.tsx +1 -1
- package/src/components/PieChart.js +404 -260
- package/src/components/PieTooltip.jsx +134 -0
- package/src/components/StereoBar.tsx +307 -307
- package/src/components/index.js +59 -57
- 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/useCarouselAxisX.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
package/lib/components/Band.js
CHANGED
|
@@ -1,34 +1,23 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
4
|
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
|
-
|
|
7
5
|
Object.defineProperty(exports, "__esModule", {
|
|
8
6
|
value: true
|
|
9
7
|
});
|
|
10
8
|
exports["default"] = void 0;
|
|
11
|
-
|
|
12
9
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
13
|
-
|
|
14
10
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
15
|
-
|
|
16
11
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
17
|
-
|
|
18
12
|
var _react = _interopRequireWildcard(require("react"));
|
|
19
|
-
|
|
20
13
|
var _d3v = require("d3v7");
|
|
21
|
-
|
|
22
14
|
var _utils = require("../utils");
|
|
23
|
-
|
|
24
15
|
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
|
-
|
|
26
16
|
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
|
-
|
|
28
17
|
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; }
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
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
|
+
* (柱状/条形)图柱子
|
|
20
|
+
*/
|
|
32
21
|
var getHighlightData = function getHighlightData(data, extent) {
|
|
33
22
|
switch (extent) {
|
|
34
23
|
case "min":
|
|
@@ -40,7 +29,6 @@ var getHighlightData = function getHighlightData(data, extent) {
|
|
|
40
29
|
flag: minData == item.data.y ? "min" : ""
|
|
41
30
|
});
|
|
42
31
|
});
|
|
43
|
-
|
|
44
32
|
case "max":
|
|
45
33
|
var maxData = (0, _d3v.max)(data, function (d) {
|
|
46
34
|
return d.data.y;
|
|
@@ -50,18 +38,16 @@ var getHighlightData = function getHighlightData(data, extent) {
|
|
|
50
38
|
flag: maxData == item.data.y ? "max" : ""
|
|
51
39
|
});
|
|
52
40
|
});
|
|
53
|
-
|
|
54
41
|
default:
|
|
55
42
|
return data;
|
|
56
43
|
}
|
|
57
44
|
};
|
|
58
|
-
|
|
59
45
|
var getAttr = function getAttr(_ref) {
|
|
60
46
|
var isVertical = _ref.isVertical,
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
47
|
+
seriesWidth = _ref.seriesWidth,
|
|
48
|
+
length = _ref.length,
|
|
49
|
+
x = _ref.x,
|
|
50
|
+
y = _ref.y;
|
|
65
51
|
if (isVertical) return {
|
|
66
52
|
width: length,
|
|
67
53
|
height: seriesWidth,
|
|
@@ -75,86 +61,80 @@ var getAttr = function getAttr(_ref) {
|
|
|
75
61
|
height: length
|
|
76
62
|
};
|
|
77
63
|
};
|
|
78
|
-
|
|
79
64
|
var getBorderRadius = function getBorderRadius(_ref2) {
|
|
80
65
|
var isVertical = _ref2.isVertical,
|
|
81
|
-
|
|
82
|
-
|
|
66
|
+
positive = _ref2.positive,
|
|
67
|
+
seriesWidth = _ref2.seriesWidth;
|
|
83
68
|
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";
|
|
84
69
|
};
|
|
85
|
-
|
|
86
70
|
var _default = /*#__PURE__*/(0, _react.memo)(function (_ref3) {
|
|
87
71
|
var triggerClick = _ref3.triggerClick,
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
72
|
+
indicatorWidth = _ref3.indicatorWidth,
|
|
73
|
+
setControlChartTooltipShow = _ref3.setControlChartTooltipShow,
|
|
74
|
+
setControlChartTooltipX = _ref3.setControlChartTooltipX,
|
|
75
|
+
setControlChartTooltipXName = _ref3.setControlChartTooltipXName,
|
|
76
|
+
_ref3$isControlChart = _ref3.isControlChart,
|
|
77
|
+
isControlChart = _ref3$isControlChart === void 0 ? false : _ref3$isControlChart,
|
|
78
|
+
setControlChartIndicatorList = _ref3.setControlChartIndicatorList,
|
|
79
|
+
_ref3$config = _ref3.config,
|
|
80
|
+
_ref3$config$pattern = _ref3$config.pattern,
|
|
81
|
+
pattern = _ref3$config$pattern === void 0 ? {} : _ref3$config$pattern,
|
|
82
|
+
_ref3$config$seriesIn = _ref3$config.seriesIntervalWidth,
|
|
83
|
+
paddingInner = _ref3$config$seriesIn === void 0 ? 0 : _ref3$config$seriesIn,
|
|
84
|
+
_ref3$config$paddingI = _ref3$config.paddingInner,
|
|
85
|
+
paddingOuter = _ref3$config$paddingI === void 0 ? 0 : _ref3$config$paddingI,
|
|
86
|
+
style = _ref3$config.style,
|
|
87
|
+
fillType = _ref3$config.fillType,
|
|
88
|
+
url = _ref3$config.url,
|
|
89
|
+
size = _ref3$config.size,
|
|
90
|
+
fill = _ref3$config.fill,
|
|
91
|
+
border = _ref3$config.border,
|
|
92
|
+
opacity = _ref3$config.opacity,
|
|
93
|
+
_ref3$config$highligh = _ref3$config.highlight,
|
|
94
|
+
showHighlight = _ref3$config$highligh.show,
|
|
95
|
+
extent = _ref3$config$highligh.extent,
|
|
96
|
+
highlightFill = _ref3$config$highligh.fill,
|
|
97
|
+
headDecorate = _ref3$config.headDecorate,
|
|
98
|
+
_ref3$bandLength = _ref3.bandLength,
|
|
99
|
+
bandLength = _ref3$bandLength === void 0 ? 0 : _ref3$bandLength,
|
|
100
|
+
data = _ref3.data,
|
|
101
|
+
_ref3$xAxis = _ref3.xAxis,
|
|
102
|
+
xScaler = _ref3$xAxis.scaler,
|
|
103
|
+
step = _ref3$xAxis.step,
|
|
104
|
+
direction = _ref3$xAxis.direction,
|
|
105
|
+
xAxis = _ref3.xAxis,
|
|
106
|
+
_ref3$yAxis = _ref3.yAxis,
|
|
107
|
+
yScaler = _ref3$yAxis.scaler,
|
|
108
|
+
isClipAxis = _ref3$yAxis.isClipAxis,
|
|
109
|
+
clipValue = _ref3$yAxis.clipValue;
|
|
126
110
|
if (!data.length) return null;
|
|
127
|
-
|
|
128
111
|
var _getSeriesInfo = (0, _utils.getSeriesInfo)({
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
112
|
+
step: step,
|
|
113
|
+
bandLength: bandLength,
|
|
114
|
+
paddingInner: paddingInner,
|
|
115
|
+
paddingOuter: paddingOuter
|
|
116
|
+
}),
|
|
117
|
+
seriesWidth = _getSeriesInfo.seriesWidth,
|
|
118
|
+
seriesStep = _getSeriesInfo.seriesStep,
|
|
119
|
+
seriesStart = _getSeriesInfo.seriesStart;
|
|
138
120
|
var _data = showHighlight ? getHighlightData(data, extent) : data;
|
|
139
|
-
|
|
140
121
|
var isVertical = direction === "vertical";
|
|
141
122
|
var borderStr = "".concat(border.borderColor, " solid ").concat(border.borderWidth, "px");
|
|
142
123
|
return /*#__PURE__*/_react["default"].createElement("g", {
|
|
143
124
|
className: "__easyv-band"
|
|
144
125
|
}, _data.map(function (_ref4, i) {
|
|
145
126
|
var flag = _ref4.flag,
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
127
|
+
index = _ref4.index,
|
|
128
|
+
_ref4$bound = (0, _slicedToArray2["default"])(_ref4.bound, 2),
|
|
129
|
+
start = _ref4$bound[0],
|
|
130
|
+
end = _ref4$bound[1],
|
|
131
|
+
data = _ref4.data,
|
|
132
|
+
_ref4$data = _ref4.data,
|
|
133
|
+
x = _ref4$data.x,
|
|
134
|
+
y = _ref4$data.y,
|
|
135
|
+
s = _ref4$data.s;
|
|
136
|
+
var y1, y2;
|
|
137
|
+
//断轴图相关,断轴图的scaler是一个数组,内含上断轴下断轴的scaler
|
|
158
138
|
if (isClipAxis) {
|
|
159
139
|
if (end > +clipValue) {
|
|
160
140
|
y1 = yScaler[1](start);
|
|
@@ -167,30 +147,25 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref3) {
|
|
|
167
147
|
y1 = yScaler(isVertical ? end : start);
|
|
168
148
|
y2 = yScaler(isVertical ? start : end);
|
|
169
149
|
}
|
|
170
|
-
|
|
171
150
|
var positionX = xScaler(x) - step / 2 + seriesStart + index * seriesStep;
|
|
172
151
|
var showHead, headUrl, headWidth, headHeight, headTranslate;
|
|
173
|
-
|
|
174
152
|
if (headDecorate) {
|
|
175
153
|
showHead = headDecorate.show, headUrl = headDecorate.url, headWidth = headDecorate.size.width, headHeight = headDecorate.size.height, headTranslate = headDecorate.translate;
|
|
176
|
-
}
|
|
177
|
-
|
|
178
|
-
|
|
154
|
+
}
|
|
155
|
+
//断轴图相关,将柱形在断轴处切开
|
|
179
156
|
var setClipPath = function setClipPath() {
|
|
180
157
|
if (isClipAxis && end > +clipValue) {
|
|
181
158
|
var clipValueY2 = yScaler[0](clipValue); //上方
|
|
182
|
-
|
|
183
159
|
var clipValueY1 = yScaler[1](clipValue); //下方
|
|
184
|
-
|
|
185
160
|
var top = Math.abs((y2 - clipValueY2) / (y1 - y2)) * 100;
|
|
186
|
-
var bottom = Math.abs((y2 - clipValueY1) / (y1 - y2)) * 100;
|
|
161
|
+
var bottom = Math.abs((y2 - clipValueY1) / (y1 - y2)) * 100;
|
|
187
162
|
|
|
163
|
+
//clip path属性
|
|
188
164
|
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%)");
|
|
189
165
|
} else {
|
|
190
166
|
return "none";
|
|
191
167
|
}
|
|
192
168
|
};
|
|
193
|
-
|
|
194
169
|
if (isNaN(positionX)) return null;
|
|
195
170
|
var positionY = y < 0 ? y1 : y2;
|
|
196
171
|
var attr = getAttr({
|
|
@@ -208,7 +183,8 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref3) {
|
|
|
208
183
|
cursor: "pointer"
|
|
209
184
|
}
|
|
210
185
|
}, attr, {
|
|
211
|
-
onClick: triggerClick
|
|
186
|
+
onClick: triggerClick
|
|
187
|
+
//enter和leave事件,用于控制图的提示框
|
|
212
188
|
,
|
|
213
189
|
onMouseEnter: function onMouseEnter() {
|
|
214
190
|
if (isControlChart) {
|
|
@@ -258,7 +234,6 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref3) {
|
|
|
258
234
|
style: _objectSpread({
|
|
259
235
|
width: "100%",
|
|
260
236
|
height: "100%",
|
|
261
|
-
|
|
262
237
|
/** Safari Bug **/
|
|
263
238
|
position: "fixed",
|
|
264
239
|
clipPath: setClipPath(),
|
|
@@ -281,5 +256,4 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref3) {
|
|
|
281
256
|
}));
|
|
282
257
|
}));
|
|
283
258
|
});
|
|
284
|
-
|
|
285
259
|
exports["default"] = _default;
|
|
@@ -1,62 +1,52 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
4
|
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
6
|
-
|
|
7
5
|
Object.defineProperty(exports, "__esModule", {
|
|
8
6
|
value: true
|
|
9
7
|
});
|
|
10
8
|
exports["default"] = void 0;
|
|
11
|
-
|
|
12
9
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
13
|
-
|
|
14
10
|
var _react = _interopRequireWildcard(require("react"));
|
|
15
|
-
|
|
16
11
|
var _utils = require("../utils");
|
|
17
|
-
|
|
18
12
|
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
|
-
|
|
20
13
|
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
|
-
|
|
22
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; }
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
15
|
+
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; } /**
|
|
16
|
+
* 参考线
|
|
17
|
+
*/
|
|
26
18
|
var _default = /*#__PURE__*/(0, _react.memo)(function (_ref) {
|
|
27
19
|
var width = _ref.width,
|
|
28
|
-
|
|
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
|
-
|
|
20
|
+
height = _ref.height,
|
|
21
|
+
orientation = _ref.baseLineOri,
|
|
22
|
+
_ref$config = _ref.config,
|
|
23
|
+
_ref$config$dataStyle = _ref$config.dataStyle,
|
|
24
|
+
_ref$config$dataStyle2 = _ref$config$dataStyle.data,
|
|
25
|
+
dataShow = _ref$config$dataStyle2.show,
|
|
26
|
+
dataStyle = _ref$config$dataStyle2.dataStyle,
|
|
27
|
+
dataTranslate = _ref$config$dataStyle2.translate,
|
|
28
|
+
_ref$config$dataStyle3 = _ref$config$dataStyle.label,
|
|
29
|
+
label = _ref$config$dataStyle3.label,
|
|
30
|
+
labelShow = _ref$config$dataStyle3.show,
|
|
31
|
+
textStyle = _ref$config$dataStyle3.textStyle,
|
|
32
|
+
labelTranslate = _ref$config$dataStyle3.translate,
|
|
33
|
+
_ref$config$line = _ref$config.line,
|
|
34
|
+
color = _ref$config$line.color,
|
|
35
|
+
lineType = _ref$config$line.lineType,
|
|
36
|
+
lineWidth = _ref$config$line.lineWidth,
|
|
37
|
+
_ref$config$line$marg = _ref$config$line.margin,
|
|
38
|
+
marginLeft = _ref$config$line$marg.marginLeft,
|
|
39
|
+
marginRight = _ref$config$line$marg.marginRight,
|
|
40
|
+
strokeDasharray = _ref$config$line.strokeDasharray,
|
|
41
|
+
yOrZ = _ref.yOrZ,
|
|
42
|
+
_ref$yAxis = _ref.yAxis,
|
|
43
|
+
yScaler = _ref$yAxis.scaler,
|
|
44
|
+
clipValue = _ref$yAxis.clipValue,
|
|
45
|
+
isClipAxis = _ref$yAxis.isClipAxis,
|
|
46
|
+
scaler = _ref.axisX.scaler,
|
|
47
|
+
data = _ref.data;
|
|
57
48
|
try {
|
|
58
49
|
var x1, x2, y1, y2;
|
|
59
|
-
|
|
60
50
|
if (isClipAxis) {
|
|
61
51
|
if (data.value > +clipValue) {
|
|
62
52
|
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);
|
|
@@ -69,15 +59,13 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref) {
|
|
|
69
59
|
} else {
|
|
70
60
|
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);
|
|
71
61
|
}
|
|
72
|
-
}
|
|
73
|
-
|
|
74
|
-
|
|
62
|
+
}
|
|
63
|
+
//当坐标值存在undefined时,返回null
|
|
75
64
|
if ([x1, x2, y1, y2].some(function (d) {
|
|
76
65
|
return d == undefined;
|
|
77
66
|
})) {
|
|
78
67
|
return null;
|
|
79
68
|
}
|
|
80
|
-
|
|
81
69
|
return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("g", {
|
|
82
70
|
className: "__easyv-baseLine"
|
|
83
71
|
}, /*#__PURE__*/_react["default"].createElement("line", {
|
|
@@ -108,5 +96,4 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref) {
|
|
|
108
96
|
return null;
|
|
109
97
|
}
|
|
110
98
|
});
|
|
111
|
-
|
|
112
99
|
exports["default"] = _default;
|
package/lib/components/Brush.js
CHANGED
|
@@ -1,22 +1,17 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
-
|
|
5
4
|
Object.defineProperty(exports, "__esModule", {
|
|
6
5
|
value: true
|
|
7
6
|
});
|
|
8
7
|
exports["default"] = void 0;
|
|
9
|
-
|
|
10
8
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
11
|
-
|
|
12
9
|
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
|
13
|
-
|
|
14
10
|
var _react = require("react");
|
|
15
|
-
|
|
16
11
|
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; }
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
12
|
+
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; } /**
|
|
13
|
+
* 实现中
|
|
14
|
+
*/
|
|
20
15
|
var left = {
|
|
21
16
|
position: 'relative',
|
|
22
17
|
width: 5,
|
|
@@ -41,66 +36,57 @@ var initialPosition = {
|
|
|
41
36
|
end: 0,
|
|
42
37
|
status: ''
|
|
43
38
|
};
|
|
44
|
-
|
|
45
39
|
var getValue = function getValue(x, min, max) {
|
|
46
40
|
return Math.max(min, Math.min(x, max));
|
|
47
41
|
};
|
|
48
|
-
|
|
49
42
|
var _default = function _default(_ref) {
|
|
50
43
|
var width = _ref.width,
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
44
|
+
_ref$config = _ref.config,
|
|
45
|
+
height = _ref$config.height,
|
|
46
|
+
background = _ref$config.background,
|
|
47
|
+
_ref$config$margin = _ref$config.margin,
|
|
48
|
+
marginLeft = _ref$config$margin.marginLeft,
|
|
49
|
+
marginRight = _ref$config$margin.marginRight,
|
|
50
|
+
_ref$config$detail = _ref$config.detail,
|
|
51
|
+
blockWidth = _ref$config$detail.width,
|
|
52
|
+
color = _ref$config$detail.color;
|
|
61
53
|
var _useState = (0, _react.useState)({
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
54
|
+
translateX: 0,
|
|
55
|
+
width: blockWidth
|
|
56
|
+
}),
|
|
57
|
+
_useState2 = (0, _slicedToArray2["default"])(_useState, 2),
|
|
58
|
+
state = _useState2[0],
|
|
59
|
+
setState = _useState2[1];
|
|
69
60
|
var availableWidth = width - marginLeft - marginRight;
|
|
70
61
|
var cache = (0, _react.useRef)(state);
|
|
71
62
|
var move = (0, _react.useCallback)(function (_ref2) {
|
|
72
63
|
var delta = _ref2.delta,
|
|
73
|
-
|
|
74
|
-
|
|
64
|
+
status = _ref2.status,
|
|
65
|
+
name = _ref2.name;
|
|
75
66
|
var _cache$current = cache.current,
|
|
76
|
-
|
|
77
|
-
|
|
67
|
+
width = _cache$current.width,
|
|
68
|
+
translateX = _cache$current.translateX;
|
|
78
69
|
var minWidth = 40;
|
|
79
70
|
var minX = 0;
|
|
80
|
-
|
|
81
71
|
switch (name) {
|
|
82
72
|
case 'center':
|
|
83
73
|
translateX = getValue(translateX + delta, minX, availableWidth - width);
|
|
84
74
|
break;
|
|
85
|
-
|
|
86
75
|
case 'left':
|
|
87
76
|
var tempWidth = width;
|
|
88
77
|
width = getValue(width + delta * -1, minWidth, translateX + width);
|
|
89
78
|
translateX = getValue(translateX + delta, minX, translateX + tempWidth - width);
|
|
90
79
|
break;
|
|
91
|
-
|
|
92
80
|
case 'right':
|
|
93
81
|
width = getValue(width + delta, minWidth, availableWidth - translateX);
|
|
94
82
|
break;
|
|
95
83
|
}
|
|
96
|
-
|
|
97
84
|
if (status === 'up') {
|
|
98
85
|
cache.current = {
|
|
99
86
|
width: width,
|
|
100
87
|
translateX: translateX
|
|
101
88
|
};
|
|
102
89
|
}
|
|
103
|
-
|
|
104
90
|
setState({
|
|
105
91
|
width: width,
|
|
106
92
|
translateX: translateX
|
|
@@ -143,18 +129,15 @@ var _default = function _default(_ref) {
|
|
|
143
129
|
name: "right"
|
|
144
130
|
})));
|
|
145
131
|
};
|
|
146
|
-
|
|
147
132
|
exports["default"] = _default;
|
|
148
133
|
var Move = /*#__PURE__*/(0, _react.memo)(function (_ref3) {
|
|
149
134
|
var style = _ref3.style,
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
135
|
+
move = _ref3.move,
|
|
136
|
+
name = _ref3.name;
|
|
153
137
|
var _useState3 = (0, _react.useState)(initialPosition),
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
138
|
+
_useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
|
|
139
|
+
position = _useState4[0],
|
|
140
|
+
setPosition = _useState4[1];
|
|
158
141
|
var documentOnMouseMove = (0, _react.useCallback)(function (e) {
|
|
159
142
|
// console.log('documentOnMouseMove');
|
|
160
143
|
setPosition(function (position) {
|
|
@@ -187,8 +170,8 @@ var Move = /*#__PURE__*/(0, _react.memo)(function (_ref3) {
|
|
|
187
170
|
}, []);
|
|
188
171
|
(0, _react.useEffect)(function () {
|
|
189
172
|
var start = position.start,
|
|
190
|
-
|
|
191
|
-
|
|
173
|
+
end = position.end,
|
|
174
|
+
status = position.status;
|
|
192
175
|
move({
|
|
193
176
|
delta: end - start,
|
|
194
177
|
status: status,
|