@easyv/charts 1.5.4 → 1.5.5
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/lib/components/Line.js +61 -67
- package/lib/hooks/useStackData.js +21 -18
- package/package.json +1 -1
- package/src/components/Line.js +13 -11
- package/src/hooks/useStackData.js +22 -21
package/lib/components/Line.js
CHANGED
|
@@ -15,8 +15,6 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
|
|
|
15
15
|
|
|
16
16
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
17
17
|
|
|
18
|
-
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
19
|
-
|
|
20
18
|
var _react = _interopRequireWildcard(require("react"));
|
|
21
19
|
|
|
22
20
|
var _d3v = require("d3v7");
|
|
@@ -25,8 +23,6 @@ var _utils = require("../utils");
|
|
|
25
23
|
|
|
26
24
|
var _ = require(".");
|
|
27
25
|
|
|
28
|
-
var _excluded = ["data"];
|
|
29
|
-
|
|
30
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); }
|
|
31
27
|
|
|
32
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; }
|
|
@@ -40,33 +36,32 @@ var defined = function defined(d) {
|
|
|
40
36
|
};
|
|
41
37
|
|
|
42
38
|
var getLineData = function getLineData(data, connectNulls) {
|
|
43
|
-
return
|
|
44
|
-
var
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
y: +data.y
|
|
39
|
+
return data.flatMap(function (d) {
|
|
40
|
+
var y = d.data.y;
|
|
41
|
+
return isNaN(y) ? connectNulls ? [] : _objectSpread(_objectSpread({}, d), {}, {
|
|
42
|
+
data: _objectSpread(_objectSpread({}, d.data), {}, {
|
|
43
|
+
y: null
|
|
49
44
|
})
|
|
50
|
-
});
|
|
51
|
-
})
|
|
45
|
+
}) : d;
|
|
46
|
+
});
|
|
52
47
|
};
|
|
53
48
|
|
|
54
|
-
var Area = function Area(
|
|
55
|
-
var data =
|
|
56
|
-
config =
|
|
57
|
-
|
|
58
|
-
id =
|
|
59
|
-
fill =
|
|
60
|
-
type =
|
|
61
|
-
url =
|
|
62
|
-
opacity =
|
|
63
|
-
|
|
64
|
-
patternW =
|
|
65
|
-
patternH =
|
|
66
|
-
curve =
|
|
67
|
-
tension =
|
|
68
|
-
xScaler =
|
|
69
|
-
yScaler =
|
|
49
|
+
var Area = function Area(_ref) {
|
|
50
|
+
var data = _ref.data,
|
|
51
|
+
config = _ref.config,
|
|
52
|
+
_ref$config = _ref.config,
|
|
53
|
+
id = _ref$config.id,
|
|
54
|
+
fill = _ref$config.fill,
|
|
55
|
+
type = _ref$config.type,
|
|
56
|
+
url = _ref$config.url,
|
|
57
|
+
opacity = _ref$config.opacity,
|
|
58
|
+
_ref$config$size = _ref$config.size,
|
|
59
|
+
patternW = _ref$config$size.width,
|
|
60
|
+
patternH = _ref$config$size.height,
|
|
61
|
+
curve = _ref$config.curve,
|
|
62
|
+
tension = _ref$config.tension,
|
|
63
|
+
xScaler = _ref.xScaler,
|
|
64
|
+
yScaler = _ref.yScaler;
|
|
70
65
|
|
|
71
66
|
var _yScaler$range = yScaler.range(),
|
|
72
67
|
_yScaler$range2 = (0, _slicedToArray2["default"])(_yScaler$range, 1),
|
|
@@ -76,15 +71,14 @@ var Area = function Area(_ref2) {
|
|
|
76
71
|
return (0, _utils.getColorList)(fill);
|
|
77
72
|
}, [fill]);
|
|
78
73
|
var areaGen = (0, _react.useMemo)(function () {
|
|
79
|
-
var areaGen = (0, _d3v.area)().x(function (
|
|
80
|
-
var x =
|
|
74
|
+
var areaGen = (0, _d3v.area)().x(function (_ref2) {
|
|
75
|
+
var x = _ref2.data.x;
|
|
81
76
|
return xScaler(x);
|
|
82
|
-
}).y1(function (
|
|
83
|
-
var y =
|
|
77
|
+
}).y1(function (_ref3) {
|
|
78
|
+
var y = _ref3.data.y;
|
|
84
79
|
return yScaler(y);
|
|
85
|
-
})
|
|
86
|
-
|
|
87
|
-
(0, _objectDestructuringEmpty2["default"])(_ref5);
|
|
80
|
+
}).y0(function (_ref4) {
|
|
81
|
+
(0, _objectDestructuringEmpty2["default"])(_ref4);
|
|
88
82
|
return yScaler(0);
|
|
89
83
|
}).defined(defined);
|
|
90
84
|
curve && areaGen.curve(_d3v.curveCatmullRom.alpha(tension));
|
|
@@ -115,35 +109,35 @@ var Area = function Area(_ref2) {
|
|
|
115
109
|
})));
|
|
116
110
|
};
|
|
117
111
|
|
|
118
|
-
var _default = /*#__PURE__*/(0, _react.memo)(function (
|
|
119
|
-
var type =
|
|
120
|
-
|
|
121
|
-
lineType =
|
|
122
|
-
lineWidth =
|
|
123
|
-
curve =
|
|
124
|
-
tension =
|
|
125
|
-
connectNulls =
|
|
126
|
-
lineShadow =
|
|
127
|
-
lighter =
|
|
128
|
-
|
|
129
|
-
lineId =
|
|
130
|
-
stroke =
|
|
131
|
-
area =
|
|
132
|
-
data =
|
|
133
|
-
|
|
134
|
-
xScaler =
|
|
135
|
-
direction =
|
|
136
|
-
yScaler =
|
|
112
|
+
var _default = /*#__PURE__*/(0, _react.memo)(function (_ref5) {
|
|
113
|
+
var type = _ref5.type,
|
|
114
|
+
_ref5$config$line = _ref5.config.line,
|
|
115
|
+
lineType = _ref5$config$line.type,
|
|
116
|
+
lineWidth = _ref5$config$line.lineWidth,
|
|
117
|
+
curve = _ref5$config$line.curve,
|
|
118
|
+
tension = _ref5$config$line.tension,
|
|
119
|
+
connectNulls = _ref5$config$line.connectNulls,
|
|
120
|
+
lineShadow = _ref5$config$line.lineShadow,
|
|
121
|
+
lighter = _ref5$config$line.lighter,
|
|
122
|
+
_ref5$line = _ref5.line,
|
|
123
|
+
lineId = _ref5$line.id,
|
|
124
|
+
stroke = _ref5$line.stroke,
|
|
125
|
+
area = _ref5.area,
|
|
126
|
+
data = _ref5.data,
|
|
127
|
+
_ref5$xAxis = _ref5.xAxis,
|
|
128
|
+
xScaler = _ref5$xAxis.scaler,
|
|
129
|
+
direction = _ref5$xAxis.direction,
|
|
130
|
+
yScaler = _ref5.yAxis.scaler;
|
|
137
131
|
if (!data.length) return null;
|
|
138
132
|
var ticks = xScaler.domain();
|
|
139
133
|
var sortData = (0, _react.useMemo)(function () {
|
|
140
|
-
var usefulData = data.filter(function (
|
|
141
|
-
var x =
|
|
134
|
+
var usefulData = data.filter(function (_ref6) {
|
|
135
|
+
var x = _ref6.data.x;
|
|
142
136
|
return ticks.indexOf(x) > -1;
|
|
143
137
|
});
|
|
144
|
-
return usefulData.sort(function (
|
|
145
|
-
var a =
|
|
146
|
-
var b =
|
|
138
|
+
return usefulData.sort(function (_ref7, _ref8) {
|
|
139
|
+
var a = _ref7.data.x;
|
|
140
|
+
var b = _ref8.data.x;
|
|
147
141
|
return ticks.indexOf(a) - ticks.indexOf(b);
|
|
148
142
|
});
|
|
149
143
|
}, [data, ticks]);
|
|
@@ -154,17 +148,17 @@ var _default = /*#__PURE__*/(0, _react.memo)(function (_ref6) {
|
|
|
154
148
|
|
|
155
149
|
var lineGen = (0, _react.useMemo)(function () {
|
|
156
150
|
var isVertical = direction === 'vertical';
|
|
157
|
-
var lineGen = (isVertical ? (0, _d3v.line)().y(function (
|
|
158
|
-
var x =
|
|
151
|
+
var lineGen = (isVertical ? (0, _d3v.line)().y(function (_ref9) {
|
|
152
|
+
var x = _ref9.data.x;
|
|
159
153
|
return xScaler(x);
|
|
160
|
-
}).x(function (
|
|
161
|
-
var y =
|
|
154
|
+
}).x(function (_ref10) {
|
|
155
|
+
var y = _ref10.data.y;
|
|
162
156
|
return yScaler(y);
|
|
163
|
-
}) : (0, _d3v.line)().x(function (
|
|
164
|
-
var x =
|
|
157
|
+
}) : (0, _d3v.line)().x(function (_ref11) {
|
|
158
|
+
var x = _ref11.data.x;
|
|
165
159
|
return xScaler(x);
|
|
166
|
-
}).y(function (
|
|
167
|
-
var y =
|
|
160
|
+
}).y(function (_ref12) {
|
|
161
|
+
var y = _ref12.data.y;
|
|
168
162
|
return yScaler(y);
|
|
169
163
|
})).defined(defined);
|
|
170
164
|
curve && lineGen.curve(_d3v.curveCatmullRom.alpha(tension));
|
|
@@ -55,31 +55,34 @@ var setStackData = function setStackData(data, series, stacks) {
|
|
|
55
55
|
var d = value[i];
|
|
56
56
|
var currentSeries = series.get(d.s);
|
|
57
57
|
|
|
58
|
-
if (
|
|
58
|
+
if (currentSeries) {
|
|
59
|
+
var type = currentSeries.type;
|
|
59
60
|
var currentStack = (0, _utils.getCurrentStack)(currentSeries, stacks);
|
|
60
61
|
|
|
61
|
-
if (
|
|
62
|
-
if (
|
|
63
|
-
|
|
64
|
-
data
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
62
|
+
if (d && d.y !== undefined && (type != "band" || type == "band" && !isNaN(d.y))) {
|
|
63
|
+
if (currentStack) {
|
|
64
|
+
if (d.y >= 0) {
|
|
65
|
+
currentSeries.data.push({
|
|
66
|
+
data: d,
|
|
67
|
+
index: currentStack.index,
|
|
68
|
+
bound: [currentStack.positive, currentStack.positive + d.y]
|
|
69
|
+
});
|
|
70
|
+
currentStack.positive += d.y;
|
|
71
|
+
} else {
|
|
72
|
+
currentSeries.data.push({
|
|
73
|
+
data: d,
|
|
74
|
+
index: currentStack.index,
|
|
75
|
+
bound: [currentStack.negative, currentStack.negative + d.y]
|
|
76
|
+
});
|
|
77
|
+
currentStack.negative += d.y;
|
|
78
|
+
}
|
|
69
79
|
} else {
|
|
70
80
|
currentSeries.data.push({
|
|
71
81
|
data: d,
|
|
72
|
-
|
|
73
|
-
|
|
82
|
+
bound: [0, d.y],
|
|
83
|
+
index: 0
|
|
74
84
|
});
|
|
75
|
-
currentStack.negative += d.y;
|
|
76
85
|
}
|
|
77
|
-
} else {
|
|
78
|
-
currentSeries.data.push({
|
|
79
|
-
data: d,
|
|
80
|
-
bound: [0, d.y],
|
|
81
|
-
index: 0
|
|
82
|
-
});
|
|
83
86
|
}
|
|
84
87
|
}
|
|
85
88
|
}
|
package/package.json
CHANGED
package/src/components/Line.js
CHANGED
|
@@ -7,13 +7,17 @@ import { getColorList } from '../utils';
|
|
|
7
7
|
import { Lighter, LinearGradient } from '.';
|
|
8
8
|
|
|
9
9
|
const defined = (d) => d.data.y != null;
|
|
10
|
-
const getLineData = (data, connectNulls) =>
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
10
|
+
const getLineData = (data, connectNulls) =>{
|
|
11
|
+
return data.flatMap(d=>{
|
|
12
|
+
const y = d.data.y;
|
|
13
|
+
return isNaN(y)?
|
|
14
|
+
connectNulls?
|
|
15
|
+
[]:
|
|
16
|
+
{...d,data:{...d.data,y:null}}:
|
|
17
|
+
d
|
|
18
|
+
});
|
|
19
|
+
}
|
|
20
|
+
|
|
17
21
|
|
|
18
22
|
const Area = ({
|
|
19
23
|
data,
|
|
@@ -38,7 +42,6 @@ const Area = ({
|
|
|
38
42
|
const areaGen = d3Area()
|
|
39
43
|
.x(({ data: { x } }) => xScaler(x))
|
|
40
44
|
.y1(({ data: { y } }) => yScaler(y))
|
|
41
|
-
// .y0(height)
|
|
42
45
|
.y0(({})=>yScaler(0))
|
|
43
46
|
.defined(defined);
|
|
44
47
|
curve && areaGen.curve(curveCatmullRom.alpha(tension));
|
|
@@ -86,7 +89,7 @@ export default memo(
|
|
|
86
89
|
}) => {
|
|
87
90
|
if (!data.length) return null;
|
|
88
91
|
const ticks = xScaler.domain();
|
|
89
|
-
|
|
92
|
+
|
|
90
93
|
const sortData = useMemo(() => {
|
|
91
94
|
const usefulData = data.filter(
|
|
92
95
|
({ data: { x } }) => ticks.indexOf(x) > -1
|
|
@@ -96,12 +99,11 @@ export default memo(
|
|
|
96
99
|
ticks.indexOf(a) - ticks.indexOf(b)
|
|
97
100
|
);
|
|
98
101
|
}, [data, ticks]);
|
|
99
|
-
|
|
102
|
+
|
|
100
103
|
const _data = useMemo(
|
|
101
104
|
() => getLineData(sortData, connectNulls),
|
|
102
105
|
[sortData, connectNulls]
|
|
103
106
|
);
|
|
104
|
-
|
|
105
107
|
const lineGen = useMemo(() => {
|
|
106
108
|
const isVertical = direction === 'vertical';
|
|
107
109
|
|
|
@@ -27,38 +27,41 @@ const resetStackData = (series) => {
|
|
|
27
27
|
|
|
28
28
|
const setStackData = (data, series, stacks) => {
|
|
29
29
|
const dataMap = group(data, (d) => d.x);
|
|
30
|
-
|
|
31
30
|
dataMap.forEach((value) => {
|
|
32
31
|
resetStacks(stacks);
|
|
33
32
|
for (let i = 0, j = value.length; i < j; i++) {
|
|
34
33
|
const d = value[i];
|
|
35
34
|
const currentSeries = series.get(d.s);
|
|
36
|
-
if
|
|
35
|
+
if(currentSeries){
|
|
36
|
+
const type = currentSeries.type;
|
|
37
37
|
const currentStack = getCurrentStack(currentSeries, stacks);
|
|
38
|
-
if (
|
|
39
|
-
if (
|
|
40
|
-
|
|
41
|
-
data
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
38
|
+
if (d && d.y !== undefined && (type!="band" || type=="band" && !isNaN(d.y))) {
|
|
39
|
+
if (currentStack) {
|
|
40
|
+
if (d.y >= 0) {
|
|
41
|
+
currentSeries.data.push({
|
|
42
|
+
data: d,
|
|
43
|
+
index: currentStack.index,
|
|
44
|
+
bound: [currentStack.positive, currentStack.positive + d.y],
|
|
45
|
+
});
|
|
46
|
+
currentStack.positive += d.y;
|
|
47
|
+
} else {
|
|
48
|
+
currentSeries.data.push({
|
|
49
|
+
data: d,
|
|
50
|
+
index: currentStack.index,
|
|
51
|
+
bound: [currentStack.negative, currentStack.negative + d.y],
|
|
52
|
+
});
|
|
53
|
+
currentStack.negative += d.y;
|
|
54
|
+
}
|
|
46
55
|
} else {
|
|
47
56
|
currentSeries.data.push({
|
|
48
57
|
data: d,
|
|
49
|
-
|
|
50
|
-
|
|
58
|
+
bound: [0, d.y],
|
|
59
|
+
index: 0,
|
|
51
60
|
});
|
|
52
|
-
currentStack.negative += d.y;
|
|
53
61
|
}
|
|
54
|
-
} else {
|
|
55
|
-
currentSeries.data.push({
|
|
56
|
-
data: d,
|
|
57
|
-
bound: [0, d.y],
|
|
58
|
-
index: 0,
|
|
59
|
-
});
|
|
60
62
|
}
|
|
61
63
|
}
|
|
64
|
+
|
|
62
65
|
}
|
|
63
66
|
});
|
|
64
67
|
dataMap.clear();
|
|
@@ -80,7 +83,6 @@ export default ({ data, series }) => {
|
|
|
80
83
|
}, [series]);
|
|
81
84
|
|
|
82
85
|
const _data = useMemo(() => dataYOrZ(data, _series.series), [data, _series]);
|
|
83
|
-
|
|
84
86
|
const tmp = useMemo(() => {
|
|
85
87
|
const { y: dataY, z: dataZ } = _data;
|
|
86
88
|
const {
|
|
@@ -91,7 +93,6 @@ export default ({ data, series }) => {
|
|
|
91
93
|
resetStackData(seriesZ);
|
|
92
94
|
setStackData(dataY, seriesY, stacks);
|
|
93
95
|
setStackData(dataZ, seriesZ, stacks);
|
|
94
|
-
|
|
95
96
|
return {
|
|
96
97
|
bandLength: stacks.filter((item) => item.type == 'band').length,
|
|
97
98
|
series: [...seriesY.values(), ...seriesZ.values()],
|