@easyv/charts 1.7.30 → 1.7.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/lib/components/CartesianChart.js +2 -1
- package/lib/components/Mapping.js +14 -3
- package/lib/components/StackData.js +2 -1
- package/lib/hooks/useStackData.js +40 -3
- package/package.json +1 -1
- package/src/components/CartesianChart.js +2 -1
- package/src/components/Chart.js +3 -3
- package/src/components/Mapping.js +8 -5
- package/src/components/StackData.js +2 -2
- package/src/hooks/useStackData.js +41 -3
|
@@ -26,6 +26,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
|
|
|
26
26
|
var Chart = /*#__PURE__*/(0, _react.memo)(function (_ref) {
|
|
27
27
|
var width = _ref.width,
|
|
28
28
|
height = _ref.height,
|
|
29
|
+
seriesData = _ref.seriesData,
|
|
29
30
|
_ref$config = _ref.config,
|
|
30
31
|
axesConfig = _ref$config.axes,
|
|
31
32
|
background = _ref$config.background,
|
|
@@ -639,7 +640,7 @@ var Chart = /*#__PURE__*/(0, _react.memo)(function (_ref) {
|
|
|
639
640
|
}
|
|
640
641
|
}), /*#__PURE__*/_react["default"].createElement(_.Legend, (0, _extends2["default"])({}, legend, {
|
|
641
642
|
filterData: filterData,
|
|
642
|
-
series:
|
|
643
|
+
series: seriesData
|
|
643
644
|
})), showTooltip && !control && /*#__PURE__*/_react["default"].createElement(_.Tooltip, (0, _extends2["default"])({
|
|
644
645
|
isVertical: isVertical
|
|
645
646
|
}, tooltip, {
|
|
@@ -65,8 +65,18 @@ var _default = exports["default"] = function _default(Component) {
|
|
|
65
65
|
var fieldName = _ref2.fieldName;
|
|
66
66
|
return !fieldName;
|
|
67
67
|
});
|
|
68
|
-
var
|
|
68
|
+
var lastSeries = series[seriesLength - 1];
|
|
69
|
+
var tmp = new Map(series.filter(function (d) {
|
|
70
|
+
return d.fieldName;
|
|
71
|
+
}).map(function (d) {
|
|
72
|
+
return [d.fieldName, {}];
|
|
73
|
+
})); //确定的系列样式
|
|
74
|
+
var i = 0;
|
|
75
|
+
var emptyArray = series.filter(function (d) {
|
|
76
|
+
return !d.fieldName;
|
|
77
|
+
}); //没有fieldsName的系列样式
|
|
69
78
|
if (!!noName) {
|
|
79
|
+
//都没名
|
|
70
80
|
data.forEach(function (_ref3, index) {
|
|
71
81
|
var key = _ref3.key;
|
|
72
82
|
var current = series[index % seriesLength];
|
|
@@ -77,14 +87,15 @@ var _default = exports["default"] = function _default(Component) {
|
|
|
77
87
|
});
|
|
78
88
|
return tmp;
|
|
79
89
|
}
|
|
80
|
-
var lastSeries = series[seriesLength - 1];
|
|
81
90
|
data.forEach(function (_ref4) {
|
|
82
91
|
var key = _ref4.key;
|
|
92
|
+
//先把有系列的渲染了,无系列的排后面
|
|
83
93
|
var current = series.find(function (_ref5) {
|
|
84
94
|
var fieldName = _ref5.fieldName;
|
|
85
95
|
return fieldName == key;
|
|
86
96
|
});
|
|
87
|
-
var result = current || lastSeries;
|
|
97
|
+
var result = current || emptyArray[i] || lastSeries;
|
|
98
|
+
if (!current) i = (i + 1) % emptyArray.length;
|
|
88
99
|
var name = (current ? current.fieldName || current.displayName : key) || '';
|
|
89
100
|
tmp.set(name, _objectSpread(_objectSpread({}, result), {}, {
|
|
90
101
|
name: name,
|
|
@@ -30,7 +30,8 @@ var _default = exports["default"] = function _default(Component) {
|
|
|
30
30
|
});
|
|
31
31
|
return /*#__PURE__*/React.createElement(Component, (0, _extends2["default"])({}, props, {
|
|
32
32
|
config: _objectSpread(_objectSpread({}, config), _config),
|
|
33
|
-
data: data
|
|
33
|
+
data: data,
|
|
34
|
+
seriesData: _config.seriesdata
|
|
34
35
|
}));
|
|
35
36
|
});
|
|
36
37
|
};
|
|
@@ -74,7 +74,41 @@ var setStackData = function setStackData(data, series, stacks) {
|
|
|
74
74
|
dataMap.clear();
|
|
75
75
|
return series;
|
|
76
76
|
};
|
|
77
|
+
var mergeDataAndSeries = function mergeDataAndSeries(data, _series) {
|
|
78
|
+
// 创建一个映射,键为系列名称,值为数据点数组
|
|
79
|
+
var dataMap = new Map();
|
|
77
80
|
|
|
81
|
+
// 遍历 data 数组,按系列名称分组数据点
|
|
82
|
+
data.forEach(function (item) {
|
|
83
|
+
var seriesName = item.s;
|
|
84
|
+
if (!dataMap.has(seriesName)) {
|
|
85
|
+
dataMap.set(seriesName, []);
|
|
86
|
+
}
|
|
87
|
+
// 构建符合目标格式的数据点对象
|
|
88
|
+
var dataPoint = {
|
|
89
|
+
data: {
|
|
90
|
+
s: item.s,
|
|
91
|
+
x: item.x,
|
|
92
|
+
y: item.y,
|
|
93
|
+
showY: item.showY
|
|
94
|
+
},
|
|
95
|
+
index: 0,
|
|
96
|
+
bound: [0, item.y]
|
|
97
|
+
};
|
|
98
|
+
dataMap.get(seriesName).push(dataPoint);
|
|
99
|
+
});
|
|
100
|
+
|
|
101
|
+
// 遍历 _series 数组,为每个系列添加对应的数据
|
|
102
|
+
return _series.map(function (series) {
|
|
103
|
+
var seriesName = series.name || series.fieldName;
|
|
104
|
+
// 查找对应系列的数据
|
|
105
|
+
var seriesData = dataMap.get(seriesName) || [];
|
|
106
|
+
// 返回合并后完整的系列对象,包含原始配置和新添加的数据
|
|
107
|
+
return _objectSpread(_objectSpread({}, series), {}, {
|
|
108
|
+
data: seriesData
|
|
109
|
+
});
|
|
110
|
+
});
|
|
111
|
+
};
|
|
78
112
|
/**
|
|
79
113
|
* 计算堆叠数据
|
|
80
114
|
* @param {Array} data 数据
|
|
@@ -96,12 +130,13 @@ var _default = exports["default"] = function _default(_ref2) {
|
|
|
96
130
|
return (0, _utils.dataYOrZ)(data, _series.series);
|
|
97
131
|
}, [data, _series]);
|
|
98
132
|
var tmp = (0, _react.useMemo)(function () {
|
|
133
|
+
var seriesdata = mergeDataAndSeries(data, Array.from(series.values()));
|
|
99
134
|
var dataY = _data.y,
|
|
100
135
|
dataZ = _data.z;
|
|
101
136
|
var stacks = _series.stacks,
|
|
102
137
|
_series$series = _series.series,
|
|
103
|
-
|
|
104
|
-
|
|
138
|
+
seriesZ = _series$series.z,
|
|
139
|
+
seriesY = _series$series.y;
|
|
105
140
|
resetStackData(seriesY);
|
|
106
141
|
resetStackData(seriesZ);
|
|
107
142
|
setStackData(dataY, seriesY, stacks);
|
|
@@ -110,7 +145,9 @@ var _default = exports["default"] = function _default(_ref2) {
|
|
|
110
145
|
bandLength: stacks.filter(function (item) {
|
|
111
146
|
return item.type == 'band';
|
|
112
147
|
}).length,
|
|
113
|
-
series:
|
|
148
|
+
// series: mergeDataAndSeries(data,Array.from(series.values())),
|
|
149
|
+
series: [].concat((0, _toConsumableArray2["default"])(seriesY.values()), (0, _toConsumableArray2["default"])(seriesZ.values())),
|
|
150
|
+
seriesdata: seriesdata
|
|
114
151
|
};
|
|
115
152
|
}, [_data, _series]);
|
|
116
153
|
return tmp;
|
package/package.json
CHANGED
|
@@ -34,6 +34,7 @@ import {
|
|
|
34
34
|
const Chart = memo(
|
|
35
35
|
({
|
|
36
36
|
width, height,
|
|
37
|
+
seriesData,
|
|
37
38
|
config: {
|
|
38
39
|
axes: axesConfig,
|
|
39
40
|
background,
|
|
@@ -659,7 +660,7 @@ const Chart = memo(
|
|
|
659
660
|
}}
|
|
660
661
|
></Control>
|
|
661
662
|
)}
|
|
662
|
-
<Legend {...legend} filterData={filterData} series={
|
|
663
|
+
<Legend {...legend} filterData={filterData} series={seriesData} />
|
|
663
664
|
{/* 非控制图下的提示框 */}
|
|
664
665
|
{showTooltip && !control && (
|
|
665
666
|
<Tooltip
|
package/src/components/Chart.js
CHANGED
|
@@ -89,7 +89,7 @@ const Chart = memo(
|
|
|
89
89
|
}),
|
|
90
90
|
[id, chartWidth, chartHeight, triggerOnRelative, svg, onEmit]
|
|
91
91
|
);
|
|
92
|
-
|
|
92
|
+
|
|
93
93
|
useEffect(()=>{
|
|
94
94
|
let isAnimation = window.screenConfig?window.screenConfig.isAnimation:true; //大屏的全局设置是否允许开启动画,false为不允许
|
|
95
95
|
if(!isAnimation) setActive(false);
|
|
@@ -107,14 +107,14 @@ const Chart = memo(
|
|
|
107
107
|
},[]);
|
|
108
108
|
|
|
109
109
|
let data = checkData(originData);
|
|
110
|
-
|
|
110
|
+
|
|
111
111
|
return (
|
|
112
112
|
<chartContext.Provider value={context}>
|
|
113
113
|
{type == 'pie' ? (
|
|
114
114
|
<PieChart id={id} config={config} data={data} active={active} {...props} />
|
|
115
115
|
) : (
|
|
116
116
|
<CartesianChart id={id} config={config} data={data} active={active} {...props} />
|
|
117
|
-
|
|
117
|
+
)}
|
|
118
118
|
</chartContext.Provider>
|
|
119
119
|
|
|
120
120
|
);
|
|
@@ -31,8 +31,11 @@ export default (Component) =>
|
|
|
31
31
|
if (!!data.length) {
|
|
32
32
|
const seriesLength = series.length;
|
|
33
33
|
const noName = series.every(({ fieldName }) => !fieldName);
|
|
34
|
-
const
|
|
35
|
-
|
|
34
|
+
const lastSeries = series[seriesLength - 1];
|
|
35
|
+
const tmp = new Map(series.filter(d=>d.fieldName).map(d=>[d.fieldName,{}])); //确定的系列样式
|
|
36
|
+
let i = 0;
|
|
37
|
+
const emptyArray = series.filter(d=>!d.fieldName); //没有fieldsName的系列样式
|
|
38
|
+
if (!!noName) {//都没名
|
|
36
39
|
data.forEach(({ key }, index) => {
|
|
37
40
|
const current = series[index % seriesLength];
|
|
38
41
|
const name = key || '';
|
|
@@ -43,10 +46,10 @@ export default (Component) =>
|
|
|
43
46
|
});
|
|
44
47
|
return tmp;
|
|
45
48
|
}
|
|
46
|
-
|
|
47
|
-
data.forEach(({ key }) => {
|
|
49
|
+
data.forEach(({ key }) => {//先把有系列的渲染了,无系列的排后面
|
|
48
50
|
const current = series.find(({ fieldName }) => fieldName == key);
|
|
49
|
-
const result = current || lastSeries;
|
|
51
|
+
const result = current || emptyArray[i]|| lastSeries;
|
|
52
|
+
if(!current) i=(i+1)%emptyArray.length;
|
|
50
53
|
const name = (current ? current.fieldName || current.displayName : key) || '';
|
|
51
54
|
tmp.set(name, {
|
|
52
55
|
...result,
|
|
@@ -7,10 +7,10 @@ export default (Component) => {
|
|
|
7
7
|
return memo(({ config: { series, ...config }, data, ...props }) => {
|
|
8
8
|
const _config = useStackData({
|
|
9
9
|
series,
|
|
10
|
-
data
|
|
10
|
+
data
|
|
11
11
|
});
|
|
12
12
|
return (
|
|
13
|
-
<Component {...props} config={{ ...config, ..._config }} data={data} />
|
|
13
|
+
<Component {...props} config={{ ...config, ..._config }} data={data} seriesData={_config.seriesdata} />
|
|
14
14
|
);
|
|
15
15
|
});
|
|
16
16
|
};
|
|
@@ -67,7 +67,42 @@ const setStackData = (data, series, stacks) => {
|
|
|
67
67
|
dataMap.clear();
|
|
68
68
|
return series;
|
|
69
69
|
};
|
|
70
|
-
|
|
70
|
+
const mergeDataAndSeries=(data, _series) =>{
|
|
71
|
+
// 创建一个映射,键为系列名称,值为数据点数组
|
|
72
|
+
const dataMap = new Map();
|
|
73
|
+
|
|
74
|
+
// 遍历 data 数组,按系列名称分组数据点
|
|
75
|
+
data.forEach(item => {
|
|
76
|
+
const seriesName = item.s;
|
|
77
|
+
if (!dataMap.has(seriesName)) {
|
|
78
|
+
dataMap.set(seriesName, []);
|
|
79
|
+
}
|
|
80
|
+
// 构建符合目标格式的数据点对象
|
|
81
|
+
const dataPoint = {
|
|
82
|
+
data: {
|
|
83
|
+
s: item.s,
|
|
84
|
+
x: item.x,
|
|
85
|
+
y: item.y,
|
|
86
|
+
showY: item.showY
|
|
87
|
+
},
|
|
88
|
+
index: 0,
|
|
89
|
+
bound: [0, item.y]
|
|
90
|
+
};
|
|
91
|
+
dataMap.get(seriesName).push(dataPoint);
|
|
92
|
+
});
|
|
93
|
+
|
|
94
|
+
// 遍历 _series 数组,为每个系列添加对应的数据
|
|
95
|
+
return _series.map(series => {
|
|
96
|
+
const seriesName = series.name || series.fieldName;
|
|
97
|
+
// 查找对应系列的数据
|
|
98
|
+
const seriesData = dataMap.get(seriesName) || [];
|
|
99
|
+
// 返回合并后完整的系列对象,包含原始配置和新添加的数据
|
|
100
|
+
return {
|
|
101
|
+
...series,
|
|
102
|
+
data: seriesData
|
|
103
|
+
};
|
|
104
|
+
});
|
|
105
|
+
}
|
|
71
106
|
/**
|
|
72
107
|
* 计算堆叠数据
|
|
73
108
|
* @param {Array} data 数据
|
|
@@ -81,13 +116,14 @@ export default ({ data, series }) => {
|
|
|
81
116
|
const _series = getSeriesMap(series);
|
|
82
117
|
return { stacks, series: seriesYOrZ(_series) };
|
|
83
118
|
}, [series]);
|
|
84
|
-
|
|
119
|
+
|
|
85
120
|
const _data = useMemo(() => dataYOrZ(data, _series.series), [data, _series]);
|
|
86
121
|
const tmp = useMemo(() => {
|
|
122
|
+
const seriesdata=mergeDataAndSeries(data,Array.from(series.values()))
|
|
87
123
|
const { y: dataY, z: dataZ } = _data;
|
|
88
124
|
const {
|
|
89
125
|
stacks,
|
|
90
|
-
series: {
|
|
126
|
+
series: { z: seriesZ,y: seriesY },
|
|
91
127
|
} = _series;
|
|
92
128
|
resetStackData(seriesY);
|
|
93
129
|
resetStackData(seriesZ);
|
|
@@ -95,7 +131,9 @@ export default ({ data, series }) => {
|
|
|
95
131
|
setStackData(dataZ, seriesZ, stacks);
|
|
96
132
|
return {
|
|
97
133
|
bandLength: stacks.filter((item) => item.type == 'band').length,
|
|
134
|
+
// series: mergeDataAndSeries(data,Array.from(series.values())),
|
|
98
135
|
series: [...seriesY.values(), ...seriesZ.values()],
|
|
136
|
+
seriesdata:seriesdata
|
|
99
137
|
};
|
|
100
138
|
}, [_data, _series]);
|
|
101
139
|
return tmp;
|