@mui/x-charts 9.2.0 → 9.3.0
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/BarChart/BarChart.js +10 -10
- package/BarChart/BarChart.mjs +10 -10
- package/BarChart/seriesConfig/bar/getColor.js +7 -53
- package/BarChart/seriesConfig/bar/getColor.mjs +7 -53
- package/BarChart/seriesConfig/bar/seriesProcessor.js +3 -1
- package/BarChart/seriesConfig/bar/seriesProcessor.mjs +3 -1
- package/BarChart/seriesConfig/bar/tooltip.js +4 -27
- package/BarChart/seriesConfig/bar/tooltip.mjs +4 -27
- package/CHANGELOG.md +118 -0
- package/ChartsContainer/ChartsContainer.js +9 -9
- package/ChartsContainer/ChartsContainer.mjs +9 -9
- package/ChartsLabel/ChartsLabelMark.js +0 -2
- package/ChartsLabel/ChartsLabelMark.mjs +0 -2
- package/ChartsLabel/labelMarkClasses.d.mts +0 -1
- package/ChartsLabel/labelMarkClasses.d.ts +0 -1
- package/ChartsLabel/labelMarkClasses.js +1 -2
- package/ChartsLabel/labelMarkClasses.mjs +2 -2
- package/ChartsLayerContainer/ChartsLayerContainer.js +36 -30
- package/ChartsLayerContainer/ChartsLayerContainer.mjs +36 -30
- package/ChartsXAxis/ChartsXAxis.js +3 -1
- package/ChartsXAxis/ChartsXAxis.mjs +3 -1
- package/ChartsYAxis/ChartsYAxis.js +3 -1
- package/ChartsYAxis/ChartsYAxis.mjs +3 -1
- package/LineChart/LineChart.js +6 -6
- package/LineChart/LineChart.mjs +6 -6
- package/LineChart/seriesConfig/curveEvaluation.js +12 -1
- package/LineChart/seriesConfig/curveEvaluation.mjs +12 -1
- package/LineChart/seriesConfig/getColor.js +7 -54
- package/LineChart/seriesConfig/getColor.mjs +7 -54
- package/LineChart/seriesConfig/seriesProcessor.d.mts +2 -4
- package/LineChart/seriesConfig/seriesProcessor.d.ts +2 -4
- package/LineChart/seriesConfig/seriesProcessor.js +2 -139
- package/LineChart/seriesConfig/seriesProcessor.mjs +2 -138
- package/LineChart/seriesConfig/tooltip.js +4 -25
- package/LineChart/seriesConfig/tooltip.mjs +4 -25
- package/PieChart/PieChart.js +6 -6
- package/PieChart/PieChart.mjs +6 -6
- package/RadarChart/RadarAxis/useRadarAxis.js +1 -1
- package/RadarChart/RadarAxis/useRadarAxis.mjs +1 -1
- package/RadarChart/RadarChart.js +8 -8
- package/RadarChart/RadarChart.mjs +8 -8
- package/RadarChart/RadarSeriesPlot/RadarSeriesArea.js +3 -1
- package/RadarChart/RadarSeriesPlot/RadarSeriesArea.mjs +3 -1
- package/RadarChart/RadarSeriesPlot/RadarSeriesMarks.js +1 -0
- package/RadarChart/RadarSeriesPlot/RadarSeriesMarks.mjs +1 -0
- package/RadarChart/RadarSeriesPlot/RadarSeriesPlot.js +1 -0
- package/RadarChart/RadarSeriesPlot/RadarSeriesPlot.mjs +1 -0
- package/ScatterChart/ScatterChart.js +11 -11
- package/ScatterChart/ScatterChart.mjs +11 -11
- package/ScatterChart/seriesConfig/tooltip.js +2 -24
- package/ScatterChart/seriesConfig/tooltip.mjs +2 -24
- package/SparkLineChart/SparkLineChart.js +27 -27
- package/SparkLineChart/SparkLineChart.mjs +27 -27
- package/index.js +1 -1
- package/index.mjs +1 -1
- package/internals/components/ChartsAccessibilityProxy/ChartsAccessibilityProxy.js +1 -1
- package/internals/components/ChartsAccessibilityProxy/ChartsAccessibilityProxy.mjs +1 -1
- package/internals/getLineLikeTooltip.d.mts +9 -0
- package/internals/getLineLikeTooltip.d.ts +9 -0
- package/internals/getLineLikeTooltip.js +38 -0
- package/internals/getLineLikeTooltip.mjs +31 -0
- package/internals/index.d.mts +3 -0
- package/internals/index.d.ts +3 -0
- package/internals/index.js +24 -0
- package/internals/index.mjs +3 -0
- package/internals/plugins/corePlugins/useChartSeriesConfig/types/tooltipGetter.types.d.mts +4 -2
- package/internals/plugins/corePlugins/useChartSeriesConfig/types/tooltipGetter.types.d.ts +4 -2
- package/internals/plugins/featurePlugins/useChartHighlight/useChartHighlight.js +3 -0
- package/internals/plugins/featurePlugins/useChartHighlight/useChartHighlight.mjs +3 -0
- package/internals/processLineLikeSeries.d.mts +6 -0
- package/internals/processLineLikeSeries.d.ts +6 -0
- package/internals/processLineLikeSeries.js +145 -0
- package/internals/processLineLikeSeries.mjs +138 -0
- package/internals/resolveColorProcessor.d.mts +11 -0
- package/internals/resolveColorProcessor.d.ts +11 -0
- package/internals/resolveColorProcessor.js +62 -0
- package/internals/resolveColorProcessor.mjs +56 -0
- package/package.json +3 -3
|
@@ -81,37 +81,43 @@ const ChartsLayerContainer = exports.ChartsLayerContainer = /*#__PURE__*/React.f
|
|
|
81
81
|
}
|
|
82
82
|
});
|
|
83
83
|
}
|
|
84
|
-
return
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
}, other, {
|
|
95
|
-
onPointerEnter: event => {
|
|
96
|
-
other.onPointerEnter?.(event);
|
|
97
|
-
instance.handlePointerEnter?.(event);
|
|
98
|
-
},
|
|
99
|
-
onPointerLeave: event => {
|
|
100
|
-
other.onPointerLeave?.(event);
|
|
101
|
-
instance.handlePointerLeave?.(event);
|
|
102
|
-
},
|
|
103
|
-
onClick: event => {
|
|
104
|
-
other.onClick?.(event);
|
|
105
|
-
instance.handleClick?.(event);
|
|
106
|
-
},
|
|
107
|
-
children: [isKeyboardNavigationEnabled && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsAccessibilityProxy.ChartsAccessibilityProxy, {}), desc && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
|
|
108
|
-
id: descId,
|
|
109
|
-
style: {
|
|
110
|
-
display: 'none'
|
|
84
|
+
return (
|
|
85
|
+
/*#__PURE__*/
|
|
86
|
+
// `role="none"` is an alias for `role="presentation"`, but aria-query treats them differently.
|
|
87
|
+
// See https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/issues/1090
|
|
88
|
+
// eslint-disable-next-line jsx-a11y/role-supports-aria-props
|
|
89
|
+
(0, _jsxRuntime.jsxs)(ChartsLayerContainerDiv, (0, _extends2.default)({
|
|
90
|
+
ref: handleRef,
|
|
91
|
+
ownerState: {
|
|
92
|
+
width: propsWidth,
|
|
93
|
+
height: propsHeight
|
|
111
94
|
},
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
95
|
+
role: "none",
|
|
96
|
+
"aria-label": title,
|
|
97
|
+
"aria-describedby": desc ? descId : undefined,
|
|
98
|
+
className: (0, _clsx.default)(classes.root, className)
|
|
99
|
+
}, other, {
|
|
100
|
+
onPointerEnter: event => {
|
|
101
|
+
other.onPointerEnter?.(event);
|
|
102
|
+
instance.handlePointerEnter?.(event);
|
|
103
|
+
},
|
|
104
|
+
onPointerLeave: event => {
|
|
105
|
+
other.onPointerLeave?.(event);
|
|
106
|
+
instance.handlePointerLeave?.(event);
|
|
107
|
+
},
|
|
108
|
+
onClick: event => {
|
|
109
|
+
other.onClick?.(event);
|
|
110
|
+
instance.handleClick?.(event);
|
|
111
|
+
},
|
|
112
|
+
children: [isKeyboardNavigationEnabled && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsAccessibilityProxy.ChartsAccessibilityProxy, {}), desc && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
|
|
113
|
+
id: descId,
|
|
114
|
+
style: {
|
|
115
|
+
display: 'none'
|
|
116
|
+
},
|
|
117
|
+
children: desc
|
|
118
|
+
}), children]
|
|
119
|
+
}))
|
|
120
|
+
);
|
|
115
121
|
});
|
|
116
122
|
if (process.env.NODE_ENV !== "production") ChartsLayerContainer.displayName = "ChartsLayerContainer";
|
|
117
123
|
process.env.NODE_ENV !== "production" ? ChartsLayerContainer.propTypes = {
|
|
@@ -75,37 +75,43 @@ const ChartsLayerContainer = /*#__PURE__*/React.forwardRef(function ChartsLayerC
|
|
|
75
75
|
}
|
|
76
76
|
});
|
|
77
77
|
}
|
|
78
|
-
return
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
}, other, {
|
|
89
|
-
onPointerEnter: event => {
|
|
90
|
-
other.onPointerEnter?.(event);
|
|
91
|
-
instance.handlePointerEnter?.(event);
|
|
92
|
-
},
|
|
93
|
-
onPointerLeave: event => {
|
|
94
|
-
other.onPointerLeave?.(event);
|
|
95
|
-
instance.handlePointerLeave?.(event);
|
|
96
|
-
},
|
|
97
|
-
onClick: event => {
|
|
98
|
-
other.onClick?.(event);
|
|
99
|
-
instance.handleClick?.(event);
|
|
100
|
-
},
|
|
101
|
-
children: [isKeyboardNavigationEnabled && /*#__PURE__*/_jsx(ChartsAccessibilityProxy, {}), desc && /*#__PURE__*/_jsx("span", {
|
|
102
|
-
id: descId,
|
|
103
|
-
style: {
|
|
104
|
-
display: 'none'
|
|
78
|
+
return (
|
|
79
|
+
/*#__PURE__*/
|
|
80
|
+
// `role="none"` is an alias for `role="presentation"`, but aria-query treats them differently.
|
|
81
|
+
// See https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/issues/1090
|
|
82
|
+
// eslint-disable-next-line jsx-a11y/role-supports-aria-props
|
|
83
|
+
_jsxs(ChartsLayerContainerDiv, _extends({
|
|
84
|
+
ref: handleRef,
|
|
85
|
+
ownerState: {
|
|
86
|
+
width: propsWidth,
|
|
87
|
+
height: propsHeight
|
|
105
88
|
},
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
89
|
+
role: "none",
|
|
90
|
+
"aria-label": title,
|
|
91
|
+
"aria-describedby": desc ? descId : undefined,
|
|
92
|
+
className: clsx(classes.root, className)
|
|
93
|
+
}, other, {
|
|
94
|
+
onPointerEnter: event => {
|
|
95
|
+
other.onPointerEnter?.(event);
|
|
96
|
+
instance.handlePointerEnter?.(event);
|
|
97
|
+
},
|
|
98
|
+
onPointerLeave: event => {
|
|
99
|
+
other.onPointerLeave?.(event);
|
|
100
|
+
instance.handlePointerLeave?.(event);
|
|
101
|
+
},
|
|
102
|
+
onClick: event => {
|
|
103
|
+
other.onClick?.(event);
|
|
104
|
+
instance.handleClick?.(event);
|
|
105
|
+
},
|
|
106
|
+
children: [isKeyboardNavigationEnabled && /*#__PURE__*/_jsx(ChartsAccessibilityProxy, {}), desc && /*#__PURE__*/_jsx("span", {
|
|
107
|
+
id: descId,
|
|
108
|
+
style: {
|
|
109
|
+
display: 'none'
|
|
110
|
+
},
|
|
111
|
+
children: desc
|
|
112
|
+
}), children]
|
|
113
|
+
}))
|
|
114
|
+
);
|
|
109
115
|
});
|
|
110
116
|
if (process.env.NODE_ENV !== "production") ChartsLayerContainer.displayName = "ChartsLayerContainer";
|
|
111
117
|
process.env.NODE_ENV !== "production" ? ChartsLayerContainer.propTypes = {
|
|
@@ -28,7 +28,9 @@ function ChartsXAxis(inProps) {
|
|
|
28
28
|
} = (0, _useAxis.useXAxes)();
|
|
29
29
|
const axis = xAxis[inProps.axisId ?? xAxisIds[0]];
|
|
30
30
|
if (!axis) {
|
|
31
|
-
|
|
31
|
+
if (process.env.NODE_ENV !== 'production') {
|
|
32
|
+
(0, _warning.warnOnce)(`MUI X Charts: No axis found. The axisId "${inProps.axisId}" is probably invalid.`);
|
|
33
|
+
}
|
|
32
34
|
return null;
|
|
33
35
|
}
|
|
34
36
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsXAxisImpl.ChartsXAxisImpl, (0, _extends2.default)({}, inProps, {
|
|
@@ -22,7 +22,9 @@ function ChartsXAxis(inProps) {
|
|
|
22
22
|
} = useXAxes();
|
|
23
23
|
const axis = xAxis[inProps.axisId ?? xAxisIds[0]];
|
|
24
24
|
if (!axis) {
|
|
25
|
-
|
|
25
|
+
if (process.env.NODE_ENV !== 'production') {
|
|
26
|
+
warnOnce(`MUI X Charts: No axis found. The axisId "${inProps.axisId}" is probably invalid.`);
|
|
27
|
+
}
|
|
26
28
|
return null;
|
|
27
29
|
}
|
|
28
30
|
return /*#__PURE__*/_jsx(ChartsXAxisImpl, _extends({}, inProps, {
|
|
@@ -28,7 +28,9 @@ function ChartsYAxis(inProps) {
|
|
|
28
28
|
} = (0, _hooks.useYAxes)();
|
|
29
29
|
const axis = yAxis[inProps.axisId ?? yAxisIds[0]];
|
|
30
30
|
if (!axis) {
|
|
31
|
-
|
|
31
|
+
if (process.env.NODE_ENV !== 'production') {
|
|
32
|
+
(0, _warning.warnOnce)(`MUI X Charts: No axis found. The axisId "${inProps.axisId}" is probably invalid.`);
|
|
33
|
+
}
|
|
32
34
|
return null;
|
|
33
35
|
}
|
|
34
36
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChartsYAxisImpl.ChartsYAxisImpl, (0, _extends2.default)({}, inProps, {
|
|
@@ -22,7 +22,9 @@ function ChartsYAxis(inProps) {
|
|
|
22
22
|
} = useYAxes();
|
|
23
23
|
const axis = yAxis[inProps.axisId ?? yAxisIds[0]];
|
|
24
24
|
if (!axis) {
|
|
25
|
-
|
|
25
|
+
if (process.env.NODE_ENV !== 'production') {
|
|
26
|
+
warnOnce(`MUI X Charts: No axis found. The axisId "${inProps.axisId}" is probably invalid.`);
|
|
27
|
+
}
|
|
26
28
|
return null;
|
|
27
29
|
}
|
|
28
30
|
return /*#__PURE__*/_jsx(ChartsYAxisImpl, _extends({}, inProps, {
|
package/LineChart/LineChart.js
CHANGED
|
@@ -205,11 +205,11 @@ process.env.NODE_ENV !== "production" ? LineChart.propTypes = {
|
|
|
205
205
|
*/
|
|
206
206
|
highlightedItem: _propTypes.default.oneOfType([_propTypes.default.shape({
|
|
207
207
|
dataIndex: _propTypes.default.number,
|
|
208
|
-
seriesId: _propTypes.default.string.isRequired
|
|
209
|
-
type: _propTypes.default.oneOf(['line']).isRequired
|
|
208
|
+
seriesId: _propTypes.default.string.isRequired
|
|
210
209
|
}), _propTypes.default.shape({
|
|
211
210
|
dataIndex: _propTypes.default.number,
|
|
212
|
-
seriesId: _propTypes.default.string.isRequired
|
|
211
|
+
seriesId: _propTypes.default.string.isRequired,
|
|
212
|
+
type: _propTypes.default.oneOf(['line']).isRequired
|
|
213
213
|
})]),
|
|
214
214
|
/**
|
|
215
215
|
* This prop is used to help implement the accessibility logic.
|
|
@@ -365,11 +365,11 @@ process.env.NODE_ENV !== "production" ? LineChart.propTypes = {
|
|
|
365
365
|
*/
|
|
366
366
|
tooltipItem: _propTypes.default.oneOfType([_propTypes.default.shape({
|
|
367
367
|
dataIndex: _propTypes.default.number,
|
|
368
|
-
seriesId: _propTypes.default.string.isRequired
|
|
369
|
-
type: _propTypes.default.oneOf(['line']).isRequired
|
|
368
|
+
seriesId: _propTypes.default.string.isRequired
|
|
370
369
|
}), _propTypes.default.shape({
|
|
371
370
|
dataIndex: _propTypes.default.number,
|
|
372
|
-
seriesId: _propTypes.default.string.isRequired
|
|
371
|
+
seriesId: _propTypes.default.string.isRequired,
|
|
372
|
+
type: _propTypes.default.oneOf(['line']).isRequired
|
|
373
373
|
})]),
|
|
374
374
|
/**
|
|
375
375
|
* The width of the chart in px. If not defined, it takes the width of the parent element.
|
package/LineChart/LineChart.mjs
CHANGED
|
@@ -198,11 +198,11 @@ process.env.NODE_ENV !== "production" ? LineChart.propTypes = {
|
|
|
198
198
|
*/
|
|
199
199
|
highlightedItem: PropTypes.oneOfType([PropTypes.shape({
|
|
200
200
|
dataIndex: PropTypes.number,
|
|
201
|
-
seriesId: PropTypes.string.isRequired
|
|
202
|
-
type: PropTypes.oneOf(['line']).isRequired
|
|
201
|
+
seriesId: PropTypes.string.isRequired
|
|
203
202
|
}), PropTypes.shape({
|
|
204
203
|
dataIndex: PropTypes.number,
|
|
205
|
-
seriesId: PropTypes.string.isRequired
|
|
204
|
+
seriesId: PropTypes.string.isRequired,
|
|
205
|
+
type: PropTypes.oneOf(['line']).isRequired
|
|
206
206
|
})]),
|
|
207
207
|
/**
|
|
208
208
|
* This prop is used to help implement the accessibility logic.
|
|
@@ -358,11 +358,11 @@ process.env.NODE_ENV !== "production" ? LineChart.propTypes = {
|
|
|
358
358
|
*/
|
|
359
359
|
tooltipItem: PropTypes.oneOfType([PropTypes.shape({
|
|
360
360
|
dataIndex: PropTypes.number,
|
|
361
|
-
seriesId: PropTypes.string.isRequired
|
|
362
|
-
type: PropTypes.oneOf(['line']).isRequired
|
|
361
|
+
seriesId: PropTypes.string.isRequired
|
|
363
362
|
}), PropTypes.shape({
|
|
364
363
|
dataIndex: PropTypes.number,
|
|
365
|
-
seriesId: PropTypes.string.isRequired
|
|
364
|
+
seriesId: PropTypes.string.isRequired,
|
|
365
|
+
type: PropTypes.oneOf(['line']).isRequired
|
|
366
366
|
})]),
|
|
367
367
|
/**
|
|
368
368
|
* The width of the chart in px. If not defined, it takes the width of the parent element.
|
|
@@ -161,14 +161,25 @@ function evaluateCurveY(points, targetX, curveType) {
|
|
|
161
161
|
const capture = new SegmentCapture();
|
|
162
162
|
const factory = (0, _getCurve.getCurveFactory)(curveType);
|
|
163
163
|
const curveInstance = factory(capture);
|
|
164
|
+
|
|
165
|
+
// Track which side of targetX the first point is on, so we detect the
|
|
166
|
+
// crossing regardless of whether x is increasing or decreasing.
|
|
167
|
+
const initialSide = points[0].x > targetX;
|
|
168
|
+
let searchStartIndex = 0;
|
|
169
|
+
let crossingDetected = false;
|
|
164
170
|
curveInstance.lineStart();
|
|
165
171
|
for (const p of points) {
|
|
172
|
+
if (!crossingDetected && p.x > targetX !== initialSide) {
|
|
173
|
+
searchStartIndex = Math.max(0, capture.segments.length - 1);
|
|
174
|
+
crossingDetected = true;
|
|
175
|
+
}
|
|
166
176
|
curveInstance.point(p.x, p.y);
|
|
167
177
|
}
|
|
168
178
|
curveInstance.lineEnd();
|
|
169
179
|
|
|
170
180
|
// Find the segment containing targetX.
|
|
171
|
-
for (
|
|
181
|
+
for (let i = searchStartIndex; i < capture.segments.length; i += 1) {
|
|
182
|
+
const segment = capture.segments[i];
|
|
172
183
|
if (targetX < segment.x0 + 0.5 && targetX > segment.x0 - 0.5) {
|
|
173
184
|
return segment.y0;
|
|
174
185
|
}
|
|
@@ -155,14 +155,25 @@ export function evaluateCurveY(points, targetX, curveType) {
|
|
|
155
155
|
const capture = new SegmentCapture();
|
|
156
156
|
const factory = getCurveFactory(curveType);
|
|
157
157
|
const curveInstance = factory(capture);
|
|
158
|
+
|
|
159
|
+
// Track which side of targetX the first point is on, so we detect the
|
|
160
|
+
// crossing regardless of whether x is increasing or decreasing.
|
|
161
|
+
const initialSide = points[0].x > targetX;
|
|
162
|
+
let searchStartIndex = 0;
|
|
163
|
+
let crossingDetected = false;
|
|
158
164
|
curveInstance.lineStart();
|
|
159
165
|
for (const p of points) {
|
|
166
|
+
if (!crossingDetected && p.x > targetX !== initialSide) {
|
|
167
|
+
searchStartIndex = Math.max(0, capture.segments.length - 1);
|
|
168
|
+
crossingDetected = true;
|
|
169
|
+
}
|
|
160
170
|
curveInstance.point(p.x, p.y);
|
|
161
171
|
}
|
|
162
172
|
curveInstance.lineEnd();
|
|
163
173
|
|
|
164
174
|
// Find the segment containing targetX.
|
|
165
|
-
for (
|
|
175
|
+
for (let i = searchStartIndex; i < capture.segments.length; i += 1) {
|
|
176
|
+
const segment = capture.segments[i];
|
|
166
177
|
if (targetX < segment.x0 + 0.5 && targetX > segment.x0 - 0.5) {
|
|
167
178
|
return segment.y0;
|
|
168
179
|
}
|
|
@@ -4,58 +4,11 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
var
|
|
8
|
-
const getColor = (series, xAxis, yAxis) => {
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
if (dataIndex === undefined) {
|
|
15
|
-
return series.color;
|
|
16
|
-
}
|
|
17
|
-
const value = series.data[dataIndex];
|
|
18
|
-
const color = value === null ? getSeriesColor({
|
|
19
|
-
value,
|
|
20
|
-
dataIndex
|
|
21
|
-
}) : yColorScale(value);
|
|
22
|
-
if (color === null) {
|
|
23
|
-
return getSeriesColor({
|
|
24
|
-
value,
|
|
25
|
-
dataIndex
|
|
26
|
-
});
|
|
27
|
-
}
|
|
28
|
-
return color;
|
|
29
|
-
};
|
|
30
|
-
}
|
|
31
|
-
if (xColorScale) {
|
|
32
|
-
return dataIndex => {
|
|
33
|
-
if (dataIndex === undefined) {
|
|
34
|
-
return series.color;
|
|
35
|
-
}
|
|
36
|
-
const value = xAxis.data?.[dataIndex];
|
|
37
|
-
const color = value === null ? getSeriesColor({
|
|
38
|
-
value,
|
|
39
|
-
dataIndex
|
|
40
|
-
}) : xColorScale(value);
|
|
41
|
-
if (color === null) {
|
|
42
|
-
return getSeriesColor({
|
|
43
|
-
value,
|
|
44
|
-
dataIndex
|
|
45
|
-
});
|
|
46
|
-
}
|
|
47
|
-
return color;
|
|
48
|
-
};
|
|
49
|
-
}
|
|
50
|
-
return dataIndex => {
|
|
51
|
-
if (dataIndex === undefined) {
|
|
52
|
-
return series.color;
|
|
53
|
-
}
|
|
54
|
-
const value = series.data[dataIndex];
|
|
55
|
-
return getSeriesColor({
|
|
56
|
-
value,
|
|
57
|
-
dataIndex
|
|
58
|
-
});
|
|
59
|
-
};
|
|
60
|
-
};
|
|
7
|
+
var _resolveColorProcessor = require("../../internals/resolveColorProcessor");
|
|
8
|
+
const getColor = (series, xAxis, yAxis) => (0, _resolveColorProcessor.resolveColorProcessor)({
|
|
9
|
+
series,
|
|
10
|
+
valueColorScale: yAxis?.colorScale,
|
|
11
|
+
categoryColorScale: xAxis?.colorScale,
|
|
12
|
+
categoryValues: xAxis?.data
|
|
13
|
+
});
|
|
61
14
|
var _default = exports.default = getColor;
|
|
@@ -1,55 +1,8 @@
|
|
|
1
|
-
import {
|
|
2
|
-
const getColor = (series, xAxis, yAxis) => {
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
if (dataIndex === undefined) {
|
|
9
|
-
return series.color;
|
|
10
|
-
}
|
|
11
|
-
const value = series.data[dataIndex];
|
|
12
|
-
const color = value === null ? getSeriesColor({
|
|
13
|
-
value,
|
|
14
|
-
dataIndex
|
|
15
|
-
}) : yColorScale(value);
|
|
16
|
-
if (color === null) {
|
|
17
|
-
return getSeriesColor({
|
|
18
|
-
value,
|
|
19
|
-
dataIndex
|
|
20
|
-
});
|
|
21
|
-
}
|
|
22
|
-
return color;
|
|
23
|
-
};
|
|
24
|
-
}
|
|
25
|
-
if (xColorScale) {
|
|
26
|
-
return dataIndex => {
|
|
27
|
-
if (dataIndex === undefined) {
|
|
28
|
-
return series.color;
|
|
29
|
-
}
|
|
30
|
-
const value = xAxis.data?.[dataIndex];
|
|
31
|
-
const color = value === null ? getSeriesColor({
|
|
32
|
-
value,
|
|
33
|
-
dataIndex
|
|
34
|
-
}) : xColorScale(value);
|
|
35
|
-
if (color === null) {
|
|
36
|
-
return getSeriesColor({
|
|
37
|
-
value,
|
|
38
|
-
dataIndex
|
|
39
|
-
});
|
|
40
|
-
}
|
|
41
|
-
return color;
|
|
42
|
-
};
|
|
43
|
-
}
|
|
44
|
-
return dataIndex => {
|
|
45
|
-
if (dataIndex === undefined) {
|
|
46
|
-
return series.color;
|
|
47
|
-
}
|
|
48
|
-
const value = series.data[dataIndex];
|
|
49
|
-
return getSeriesColor({
|
|
50
|
-
value,
|
|
51
|
-
dataIndex
|
|
52
|
-
});
|
|
53
|
-
};
|
|
54
|
-
};
|
|
1
|
+
import { resolveColorProcessor } from "../../internals/resolveColorProcessor.mjs";
|
|
2
|
+
const getColor = (series, xAxis, yAxis) => resolveColorProcessor({
|
|
3
|
+
series,
|
|
4
|
+
valueColorScale: yAxis?.colorScale,
|
|
5
|
+
categoryColorScale: xAxis?.colorScale,
|
|
6
|
+
categoryValues: xAxis?.data
|
|
7
|
+
});
|
|
55
8
|
export default getColor;
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
3
|
-
import type { IsItemVisibleFunction } from "../../internals/plugins/featurePlugins/useChartVisibilityManager/index.mjs";
|
|
4
|
-
declare function seriesProcessor(params: SeriesProcessorParams<'line'>, dataset?: Readonly<DatasetType>, isItemVisible?: IsItemVisibleFunction): SeriesProcessorResult<'line'>;
|
|
1
|
+
import type { SeriesProcessor } from "../../internals/plugins/corePlugins/useChartSeriesConfig/index.mjs";
|
|
2
|
+
declare const seriesProcessor: SeriesProcessor<'line'>;
|
|
5
3
|
export default seriesProcessor;
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
3
|
-
import type { IsItemVisibleFunction } from "../../internals/plugins/featurePlugins/useChartVisibilityManager/index.js";
|
|
4
|
-
declare function seriesProcessor(params: SeriesProcessorParams<'line'>, dataset?: Readonly<DatasetType>, isItemVisible?: IsItemVisibleFunction): SeriesProcessorResult<'line'>;
|
|
1
|
+
import type { SeriesProcessor } from "../../internals/plugins/corePlugins/useChartSeriesConfig/index.js";
|
|
2
|
+
declare const seriesProcessor: SeriesProcessor<'line'>;
|
|
5
3
|
export default seriesProcessor;
|
|
@@ -1,146 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
3
|
Object.defineProperty(exports, "__esModule", {
|
|
5
4
|
value: true
|
|
6
5
|
});
|
|
7
6
|
exports.default = void 0;
|
|
8
|
-
var
|
|
9
|
-
|
|
10
|
-
var _d3Shape = require("@mui/x-charts-vendor/d3-shape");
|
|
11
|
-
var _warning = require("@mui/x-internals/warning");
|
|
12
|
-
var _stacking = require("../../internals/stacking");
|
|
13
|
-
const defaultShapes = ['circle', 'square', 'diamond', 'cross', 'star', 'triangle', 'wye'];
|
|
14
|
-
const lineValueFormatter = v => v == null ? '' : v.toLocaleString();
|
|
15
|
-
function seriesProcessor(params, dataset, isItemVisible) {
|
|
16
|
-
const {
|
|
17
|
-
seriesOrder,
|
|
18
|
-
series
|
|
19
|
-
} = params;
|
|
20
|
-
const stackingGroups = (0, _stacking.getStackingGroups)((0, _extends2.default)({}, params, {
|
|
21
|
-
defaultStrategy: {
|
|
22
|
-
stackOffset: 'none'
|
|
23
|
-
}
|
|
24
|
-
}));
|
|
25
|
-
const idToIndex = new Map();
|
|
26
|
-
// Create a data set with format adapted to d3
|
|
27
|
-
const d3Dataset = dataset ?? [];
|
|
28
|
-
seriesOrder.forEach((id, seriesIndex) => {
|
|
29
|
-
idToIndex.set(id, seriesIndex);
|
|
30
|
-
const data = series[id].data;
|
|
31
|
-
if (data !== undefined) {
|
|
32
|
-
data.forEach((value, dataIndex) => {
|
|
33
|
-
if (d3Dataset.length <= dataIndex) {
|
|
34
|
-
d3Dataset.push({
|
|
35
|
-
[id]: value
|
|
36
|
-
});
|
|
37
|
-
} else {
|
|
38
|
-
d3Dataset[dataIndex][id] = value;
|
|
39
|
-
}
|
|
40
|
-
});
|
|
41
|
-
} else if (series[id].valueGetter && dataset) {
|
|
42
|
-
// When valueGetter is used without dataKey, populate d3Dataset with the series id as key
|
|
43
|
-
dataset.forEach((entry, dataIndex) => {
|
|
44
|
-
const value = series[id].valueGetter(entry);
|
|
45
|
-
if (d3Dataset.length <= dataIndex) {
|
|
46
|
-
d3Dataset.push({
|
|
47
|
-
[id]: value
|
|
48
|
-
});
|
|
49
|
-
} else {
|
|
50
|
-
d3Dataset[dataIndex][id] = value;
|
|
51
|
-
}
|
|
52
|
-
});
|
|
53
|
-
} else if (dataset === undefined && process.env.NODE_ENV !== 'production') {
|
|
54
|
-
// TODO: fix mui/no-guarded-throw
|
|
55
|
-
// eslint-disable-next-line mui/no-guarded-throw
|
|
56
|
-
throw new Error(process.env.NODE_ENV !== "production" ? `MUI X Charts: Line series with id="${id}" has no data. ` + 'The chart cannot render this series without data. ' + 'Provide a data property to the series or use the dataset prop.' : (0, _formatErrorMessage2.default)(27, id));
|
|
57
|
-
}
|
|
58
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
59
|
-
if (!data && dataset) {
|
|
60
|
-
const dataKey = series[id].dataKey;
|
|
61
|
-
if (!dataKey && !series[id].valueGetter) {
|
|
62
|
-
// TODO: fix mui/no-guarded-throw
|
|
63
|
-
// eslint-disable-next-line mui/no-guarded-throw
|
|
64
|
-
throw new Error(`MUI X Charts: Line series with id="${id}" has no data, no dataKey, and no valueGetter. ` + 'When using the dataset prop, each series must have a dataKey or valueGetter to identify which dataset values to use. ' + 'Add a dataKey or valueGetter property to the series configuration.');
|
|
65
|
-
}
|
|
66
|
-
if (dataKey) {
|
|
67
|
-
dataset.forEach((entry, index) => {
|
|
68
|
-
const value = entry[dataKey];
|
|
69
|
-
if (value != null && typeof value !== 'number') {
|
|
70
|
-
(0, _warning.warnOnce)(`MUI X Charts: your dataset key "${dataKey}" is used for plotting lines, but the dataset contains the non-null non-numerical element "${value}" at index ${index}.
|
|
71
|
-
Line plots only support numeric and null values.`);
|
|
72
|
-
}
|
|
73
|
-
});
|
|
74
|
-
}
|
|
75
|
-
}
|
|
76
|
-
}
|
|
77
|
-
});
|
|
78
|
-
const completedSeries = {};
|
|
79
|
-
stackingGroups.forEach(stackingGroup => {
|
|
80
|
-
const {
|
|
81
|
-
ids,
|
|
82
|
-
stackingOffset,
|
|
83
|
-
stackingOrder
|
|
84
|
-
} = stackingGroup;
|
|
85
|
-
const keys = ids.map(id => {
|
|
86
|
-
// Use dataKey if needed and available
|
|
87
|
-
const dataKey = series[id].dataKey;
|
|
88
|
-
return series[id].data === undefined && dataKey !== undefined ? dataKey : id;
|
|
89
|
-
});
|
|
90
|
-
const stackedData = (0, _d3Shape.stack)().keys(keys).value((d, key) => d[key] ?? 0) // defaultize null value to 0
|
|
91
|
-
.order(stackingOrder).offset(stackingOffset)(d3Dataset);
|
|
92
|
-
const idOrder = stackedData.map(s => s.index);
|
|
93
|
-
const fixedOrder = () => idOrder;
|
|
94
|
-
|
|
95
|
-
// Compute visible stacked data
|
|
96
|
-
const visibleStackedData = (0, _d3Shape.stack)().keys(keys).value((d, key) => {
|
|
97
|
-
const keyIndex = keys.indexOf(key);
|
|
98
|
-
const seriesId = ids[keyIndex];
|
|
99
|
-
if (!isItemVisible?.({
|
|
100
|
-
type: 'line',
|
|
101
|
-
seriesId
|
|
102
|
-
})) {
|
|
103
|
-
// For hidden series, return 0 so they don't contribute to the stack
|
|
104
|
-
return 0;
|
|
105
|
-
}
|
|
106
|
-
return d[key] ?? 0;
|
|
107
|
-
}).order(fixedOrder).offset(stackingOffset)(d3Dataset);
|
|
108
|
-
ids.forEach((id, index) => {
|
|
109
|
-
const {
|
|
110
|
-
dataKey,
|
|
111
|
-
valueGetter
|
|
112
|
-
} = series[id];
|
|
113
|
-
let data;
|
|
114
|
-
if (valueGetter) {
|
|
115
|
-
data = dataset.map(d => valueGetter(d));
|
|
116
|
-
} else if (dataKey) {
|
|
117
|
-
data = dataset.map(d => {
|
|
118
|
-
const value = d[dataKey];
|
|
119
|
-
return typeof value === 'number' ? value : null;
|
|
120
|
-
});
|
|
121
|
-
} else {
|
|
122
|
-
data = series[id].data;
|
|
123
|
-
}
|
|
124
|
-
const hidden = !isItemVisible?.({
|
|
125
|
-
type: 'line',
|
|
126
|
-
seriesId: id
|
|
127
|
-
});
|
|
128
|
-
completedSeries[id] = (0, _extends2.default)({
|
|
129
|
-
labelMarkType: 'line+mark'
|
|
130
|
-
}, series[id], {
|
|
131
|
-
shape: series[id].shape ?? defaultShapes[(idToIndex.get(id) ?? 0) % defaultShapes.length],
|
|
132
|
-
data,
|
|
133
|
-
valueFormatter: series[id].valueFormatter ?? lineValueFormatter,
|
|
134
|
-
hidden,
|
|
135
|
-
stackedData: stackedData[index],
|
|
136
|
-
visibleStackedData: visibleStackedData[index]
|
|
137
|
-
});
|
|
138
|
-
});
|
|
139
|
-
});
|
|
140
|
-
return {
|
|
141
|
-
seriesOrder,
|
|
142
|
-
stackingGroups,
|
|
143
|
-
series: completedSeries
|
|
144
|
-
};
|
|
145
|
-
}
|
|
7
|
+
var _processLineLikeSeries = require("../../internals/processLineLikeSeries");
|
|
8
|
+
const seriesProcessor = (params, dataset, isItemVisible) => (0, _processLineLikeSeries.processLineLikeSeries)(params, dataset, isItemVisible, 'line');
|
|
146
9
|
var _default = exports.default = seriesProcessor;
|