@mui/x-charts 7.0.0-beta.3 → 7.0.0-beta.4
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 +0 -2
- package/CHANGELOG.md +226 -15
- package/ChartsOnAxisClickHandler/ChartsOnAxisClickHandler.js +1 -1
- package/ChartsTooltip/utils.js +1 -1
- package/ChartsVoronoiHandler/ChartsVoronoiHandler.d.ts +0 -1
- package/ChartsVoronoiHandler/ChartsVoronoiHandler.js +1 -2
- package/ChartsXAxis/ChartsXAxis.js +1 -1
- package/ChartsYAxis/ChartsYAxis.js +1 -1
- package/Gauge/Gauge.js +0 -2
- package/Gauge/GaugeContainer.d.ts +0 -2
- package/Gauge/GaugeContainer.js +0 -2
- package/Gauge/GaugeProvider.js +3 -0
- package/Gauge/GaugeValueText.js +1 -1
- package/LineChart/LineChart.js +0 -2
- package/PieChart/PieChart.js +0 -2
- package/ResponsiveChartContainer/ResponsiveChartContainer.d.ts +0 -2
- package/ResponsiveChartContainer/ResponsiveChartContainer.js +0 -2
- package/ScatterChart/ScatterChart.js +0 -3
- package/SparkLineChart/SparkLineChart.js +0 -2
- package/context/CartesianContextProvider.d.ts +0 -8
- package/context/CartesianContextProvider.js +4 -89
- package/context/DrawingProvider.d.ts +2 -11
- package/context/DrawingProvider.js +10 -35
- package/context/HighlightProvider.js +3 -0
- package/context/InteractionProvider.js +3 -0
- package/context/SeriesContextProvider.js +3 -0
- package/context/index.d.ts +0 -2
- package/context/index.js +1 -15
- package/esm/BarChart/BarChart.js +0 -2
- package/esm/ChartsOnAxisClickHandler/ChartsOnAxisClickHandler.js +2 -2
- package/esm/ChartsTooltip/utils.js +2 -2
- package/esm/ChartsVoronoiHandler/ChartsVoronoiHandler.js +2 -3
- package/esm/ChartsXAxis/ChartsXAxis.js +1 -1
- package/esm/ChartsYAxis/ChartsYAxis.js +1 -1
- package/esm/Gauge/Gauge.js +0 -2
- package/esm/Gauge/GaugeContainer.js +0 -2
- package/esm/Gauge/GaugeProvider.js +3 -0
- package/esm/Gauge/GaugeValueText.js +1 -1
- package/esm/LineChart/LineChart.js +0 -2
- package/esm/PieChart/PieChart.js +0 -2
- package/esm/ResponsiveChartContainer/ResponsiveChartContainer.js +0 -2
- package/esm/ScatterChart/ScatterChart.js +0 -3
- package/esm/SparkLineChart/SparkLineChart.js +0 -2
- package/esm/context/CartesianContextProvider.js +3 -88
- package/esm/context/DrawingProvider.js +10 -36
- package/esm/context/HighlightProvider.js +3 -0
- package/esm/context/InteractionProvider.js +3 -0
- package/esm/context/SeriesContextProvider.js +3 -0
- package/esm/context/index.js +1 -2
- package/esm/hooks/useAxisEvents.js +2 -2
- package/hooks/useAxisEvents.js +1 -1
- package/hooks/useTicks.d.ts +1 -1
- package/index.js +1 -1
- package/modern/BarChart/BarChart.js +0 -2
- package/modern/ChartsOnAxisClickHandler/ChartsOnAxisClickHandler.js +2 -2
- package/modern/ChartsTooltip/utils.js +2 -2
- package/modern/ChartsVoronoiHandler/ChartsVoronoiHandler.js +2 -3
- package/modern/ChartsXAxis/ChartsXAxis.js +1 -1
- package/modern/ChartsYAxis/ChartsYAxis.js +1 -1
- package/modern/Gauge/Gauge.js +0 -2
- package/modern/Gauge/GaugeContainer.js +0 -2
- package/modern/Gauge/GaugeProvider.js +3 -0
- package/modern/Gauge/GaugeValueText.js +1 -1
- package/modern/LineChart/LineChart.js +0 -2
- package/modern/PieChart/PieChart.js +0 -2
- package/modern/ResponsiveChartContainer/ResponsiveChartContainer.js +0 -2
- package/modern/ScatterChart/ScatterChart.js +0 -3
- package/modern/SparkLineChart/SparkLineChart.js +0 -2
- package/modern/context/CartesianContextProvider.js +3 -88
- package/modern/context/DrawingProvider.js +10 -36
- package/modern/context/HighlightProvider.js +3 -0
- package/modern/context/InteractionProvider.js +3 -0
- package/modern/context/SeriesContextProvider.js +3 -0
- package/modern/context/index.js +1 -2
- package/modern/hooks/useAxisEvents.js +2 -2
- package/modern/index.js +1 -1
- package/package.json +1 -1
- package/legacy/BarChart/BarChart.js +0 -440
- package/legacy/BarChart/BarElement.js +0 -119
- package/legacy/BarChart/BarPlot.js +0 -232
- package/legacy/BarChart/extremums.js +0 -45
- package/legacy/BarChart/formatter.js +0 -78
- package/legacy/BarChart/index.js +0 -3
- package/legacy/BarChart/legend.js +0 -15
- package/legacy/ChartContainer/ChartContainer.js +0 -189
- package/legacy/ChartContainer/index.js +0 -1
- package/legacy/ChartsAxis/ChartsAxis.js +0 -215
- package/legacy/ChartsAxis/axisClasses.js +0 -5
- package/legacy/ChartsAxis/index.js +0 -2
- package/legacy/ChartsAxisHighlight/ChartsAxisHighlight.js +0 -105
- package/legacy/ChartsAxisHighlight/index.js +0 -1
- package/legacy/ChartsClipPath/ChartsClipPath.js +0 -48
- package/legacy/ChartsClipPath/index.js +0 -1
- package/legacy/ChartsGrid/ChartsGrid.js +0 -119
- package/legacy/ChartsGrid/chartsGridClasses.js +0 -6
- package/legacy/ChartsGrid/index.js +0 -2
- package/legacy/ChartsLegend/ChartsLegend.js +0 -100
- package/legacy/ChartsLegend/DefaultChartsLegend.js +0 -302
- package/legacy/ChartsLegend/chartsLegendClasses.js +0 -5
- package/legacy/ChartsLegend/index.js +0 -4
- package/legacy/ChartsLegend/utils.js +0 -15
- package/legacy/ChartsOnAxisClickHandler/ChartsOnAxisClickHandler.js +0 -75
- package/legacy/ChartsOnAxisClickHandler/index.js +0 -1
- package/legacy/ChartsReferenceLine/ChartsReferenceLine.js +0 -72
- package/legacy/ChartsReferenceLine/ChartsXReferenceLine.js +0 -105
- package/legacy/ChartsReferenceLine/ChartsYReferenceLine.js +0 -105
- package/legacy/ChartsReferenceLine/chartsReferenceLineClasses.js +0 -6
- package/legacy/ChartsReferenceLine/common.js +0 -19
- package/legacy/ChartsReferenceLine/index.js +0 -2
- package/legacy/ChartsSurface.js +0 -78
- package/legacy/ChartsText/ChartsText.js +0 -95
- package/legacy/ChartsText/index.js +0 -1
- package/legacy/ChartsTooltip/ChartsAxisTooltipContent.js +0 -96
- package/legacy/ChartsTooltip/ChartsItemTooltipContent.js +0 -53
- package/legacy/ChartsTooltip/ChartsTooltip.js +0 -148
- package/legacy/ChartsTooltip/ChartsTooltipTable.js +0 -80
- package/legacy/ChartsTooltip/DefaultChartsAxisTooltipContent.js +0 -118
- package/legacy/ChartsTooltip/DefaultChartsItemTooltipContent.js +0 -78
- package/legacy/ChartsTooltip/chartsTooltipClasses.js +0 -5
- package/legacy/ChartsTooltip/index.js +0 -6
- package/legacy/ChartsTooltip/utils.js +0 -103
- package/legacy/ChartsVoronoiHandler/ChartsVoronoiHandler.js +0 -206
- package/legacy/ChartsVoronoiHandler/index.js +0 -1
- package/legacy/ChartsXAxis/ChartsXAxis.js +0 -339
- package/legacy/ChartsXAxis/index.js +0 -1
- package/legacy/ChartsYAxis/ChartsYAxis.js +0 -267
- package/legacy/ChartsYAxis/index.js +0 -1
- package/legacy/Gauge/Gauge.js +0 -146
- package/legacy/Gauge/GaugeContainer.js +0 -215
- package/legacy/Gauge/GaugeProvider.js +0 -87
- package/legacy/Gauge/GaugeReferenceArc.js +0 -37
- package/legacy/Gauge/GaugeValueArc.js +0 -44
- package/legacy/Gauge/GaugeValueText.js +0 -66
- package/legacy/Gauge/gaugeClasses.js +0 -7
- package/legacy/Gauge/index.js +0 -7
- package/legacy/Gauge/utils.js +0 -84
- package/legacy/LineChart/AnimatedArea.js +0 -102
- package/legacy/LineChart/AnimatedLine.js +0 -104
- package/legacy/LineChart/AreaElement.js +0 -112
- package/legacy/LineChart/AreaPlot.js +0 -149
- package/legacy/LineChart/LineChart.js +0 -452
- package/legacy/LineChart/LineElement.js +0 -112
- package/legacy/LineChart/LineHighlightElement.js +0 -79
- package/legacy/LineChart/LineHighlightPlot.js +0 -97
- package/legacy/LineChart/LinePlot.js +0 -144
- package/legacy/LineChart/MarkElement.js +0 -153
- package/legacy/LineChart/MarkPlot.js +0 -178
- package/legacy/LineChart/extremums.js +0 -54
- package/legacy/LineChart/formatter.js +0 -82
- package/legacy/LineChart/index.js +0 -11
- package/legacy/LineChart/legend.js +0 -15
- package/legacy/PieChart/PieArc.js +0 -103
- package/legacy/PieChart/PieArcLabel.js +0 -112
- package/legacy/PieChart/PieArcLabelPlot.js +0 -193
- package/legacy/PieChart/PieArcPlot.js +0 -180
- package/legacy/PieChart/PieChart.js +0 -404
- package/legacy/PieChart/PiePlot.js +0 -137
- package/legacy/PieChart/dataTransform/transition.js +0 -149
- package/legacy/PieChart/dataTransform/useTransformData.js +0 -63
- package/legacy/PieChart/formatter.js +0 -55
- package/legacy/PieChart/index.js +0 -6
- package/legacy/PieChart/legend.js +0 -16
- package/legacy/ResponsiveChartContainer/ResponsiveChartContainer.js +0 -185
- package/legacy/ResponsiveChartContainer/index.js +0 -1
- package/legacy/ResponsiveChartContainer/useChartContainerDimensions.js +0 -73
- package/legacy/ScatterChart/Scatter.js +0 -110
- package/legacy/ScatterChart/ScatterChart.js +0 -395
- package/legacy/ScatterChart/ScatterPlot.js +0 -80
- package/legacy/ScatterChart/extremums.js +0 -39
- package/legacy/ScatterChart/formatter.js +0 -12
- package/legacy/ScatterChart/index.js +0 -3
- package/legacy/ScatterChart/legend.js +0 -15
- package/legacy/SparkLineChart/SparkLineChart.js +0 -266
- package/legacy/SparkLineChart/index.js +0 -1
- package/legacy/colorPalettes/colorPalettes.js +0 -15
- package/legacy/colorPalettes/index.js +0 -1
- package/legacy/constants.js +0 -8
- package/legacy/context/CartesianContextProvider.js +0 -327
- package/legacy/context/DrawingProvider.js +0 -74
- package/legacy/context/HighlightProvider.js +0 -56
- package/legacy/context/InteractionProvider.js +0 -81
- package/legacy/context/SeriesContextProvider.js +0 -74
- package/legacy/context/index.js +0 -2
- package/legacy/hooks/index.js +0 -2
- package/legacy/hooks/useAxisEvents.js +0 -120
- package/legacy/hooks/useChartDimensions.js +0 -18
- package/legacy/hooks/useDrawingArea.js +0 -21
- package/legacy/hooks/useInteractionItemProps.js +0 -71
- package/legacy/hooks/useMounted.js +0 -21
- package/legacy/hooks/useReducedMotion.js +0 -27
- package/legacy/hooks/useScale.js +0 -33
- package/legacy/hooks/useTicks.js +0 -65
- package/legacy/index.js +0 -33
- package/legacy/internals/components/AxisSharedComponents.js +0 -25
- package/legacy/internals/defaultizeColor.js +0 -17
- package/legacy/internals/defaultizeValueFormatter.js +0 -12
- package/legacy/internals/domUtils.js +0 -121
- package/legacy/internals/geometry.js +0 -37
- package/legacy/internals/getCurve.js +0 -39
- package/legacy/internals/getScale.js +0 -17
- package/legacy/internals/getWordsByLines.js +0 -15
- package/legacy/internals/isBandScale.js +0 -3
- package/legacy/internals/stackSeries.js +0 -92
- package/legacy/internals/useAnimatedPath.js +0 -32
- package/legacy/internals/utils.js +0 -52
- package/legacy/models/axis.js +0 -6
- package/legacy/models/helpers.js +0 -1
- package/legacy/models/index.js +0 -4
- package/legacy/models/layout.js +0 -1
- package/legacy/models/seriesType/bar.js +0 -1
- package/legacy/models/seriesType/common.js +0 -1
- package/legacy/models/seriesType/config.js +0 -1
- package/legacy/models/seriesType/index.js +0 -5
- package/legacy/models/seriesType/line.js +0 -1
- package/legacy/models/seriesType/pie.js +0 -1
- package/legacy/models/seriesType/scatter.js +0 -1
- package/legacy/models/stacking.js +0 -1
- package/legacy/themeAugmentation/index.js +0 -3
|
@@ -1,73 +0,0 @@
|
|
|
1
|
-
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
|
|
2
|
-
import * as React from 'react';
|
|
3
|
-
import useEnhancedEffect from '@mui/utils/useEnhancedEffect';
|
|
4
|
-
import ownerWindow from '@mui/utils/ownerWindow';
|
|
5
|
-
export var useChartContainerDimensions = function useChartContainerDimensions(inWidth, inHeight) {
|
|
6
|
-
var rootRef = React.useRef(null);
|
|
7
|
-
var displayError = React.useRef(false);
|
|
8
|
-
var _React$useState = React.useState(0),
|
|
9
|
-
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
10
|
-
width = _React$useState2[0],
|
|
11
|
-
setWidth = _React$useState2[1];
|
|
12
|
-
var _React$useState3 = React.useState(0),
|
|
13
|
-
_React$useState4 = _slicedToArray(_React$useState3, 2),
|
|
14
|
-
height = _React$useState4[0],
|
|
15
|
-
setHeight = _React$useState4[1];
|
|
16
|
-
|
|
17
|
-
// Adaptation of the `computeSizeAndPublishResizeEvent` from the grid.
|
|
18
|
-
var computeSize = React.useCallback(function () {
|
|
19
|
-
var mainEl = rootRef == null ? void 0 : rootRef.current;
|
|
20
|
-
if (!mainEl) {
|
|
21
|
-
return;
|
|
22
|
-
}
|
|
23
|
-
var win = ownerWindow(mainEl);
|
|
24
|
-
var computedStyle = win.getComputedStyle(mainEl);
|
|
25
|
-
var newHeight = Math.floor(parseFloat(computedStyle.height)) || 0;
|
|
26
|
-
var newWidth = Math.floor(parseFloat(computedStyle.width)) || 0;
|
|
27
|
-
setWidth(newWidth);
|
|
28
|
-
setHeight(newHeight);
|
|
29
|
-
}, []);
|
|
30
|
-
React.useEffect(function () {
|
|
31
|
-
// Ensure the error detection occurs after the first rendering.
|
|
32
|
-
displayError.current = true;
|
|
33
|
-
}, []);
|
|
34
|
-
useEnhancedEffect(function () {
|
|
35
|
-
if (inWidth !== undefined && inHeight !== undefined) {
|
|
36
|
-
return function () {};
|
|
37
|
-
}
|
|
38
|
-
computeSize();
|
|
39
|
-
var elementToObserve = rootRef.current;
|
|
40
|
-
if (typeof ResizeObserver === 'undefined') {
|
|
41
|
-
return function () {};
|
|
42
|
-
}
|
|
43
|
-
var animationFrame;
|
|
44
|
-
var observer = new ResizeObserver(function () {
|
|
45
|
-
// See https://github.com/mui/mui-x/issues/8733
|
|
46
|
-
animationFrame = requestAnimationFrame(function () {
|
|
47
|
-
computeSize();
|
|
48
|
-
});
|
|
49
|
-
});
|
|
50
|
-
if (elementToObserve) {
|
|
51
|
-
observer.observe(elementToObserve);
|
|
52
|
-
}
|
|
53
|
-
return function () {
|
|
54
|
-
if (animationFrame) {
|
|
55
|
-
window.cancelAnimationFrame(animationFrame);
|
|
56
|
-
}
|
|
57
|
-
if (elementToObserve) {
|
|
58
|
-
observer.unobserve(elementToObserve);
|
|
59
|
-
}
|
|
60
|
-
};
|
|
61
|
-
}, [computeSize, inHeight, inWidth]);
|
|
62
|
-
if (process.env.NODE_ENV !== 'production') {
|
|
63
|
-
if (displayError.current && inWidth === undefined && width === 0) {
|
|
64
|
-
console.error("MUI X Charts: ChartContainer does not have `width` prop, and its container has no `width` defined.");
|
|
65
|
-
displayError.current = false;
|
|
66
|
-
}
|
|
67
|
-
if (displayError.current && inHeight === undefined && height === 0) {
|
|
68
|
-
console.error("MUI X Charts: ChartContainer does not have `height` prop, and its container has no `height` defined.");
|
|
69
|
-
displayError.current = false;
|
|
70
|
-
}
|
|
71
|
-
}
|
|
72
|
-
return [rootRef, inWidth != null ? inWidth : width, inHeight != null ? inHeight : height];
|
|
73
|
-
};
|
|
@@ -1,110 +0,0 @@
|
|
|
1
|
-
import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
|
|
2
|
-
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
3
|
-
import * as React from 'react';
|
|
4
|
-
import PropTypes from 'prop-types';
|
|
5
|
-
import { getValueToPositionMapper } from '../hooks/useScale';
|
|
6
|
-
import { getIsFaded, getIsHighlighted, useInteractionItemProps } from '../hooks/useInteractionItemProps';
|
|
7
|
-
import { InteractionContext } from '../context/InteractionProvider';
|
|
8
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
9
|
-
/**
|
|
10
|
-
* Demos:
|
|
11
|
-
*
|
|
12
|
-
* - [Scatter](https://mui.com/x/react-charts/scatter/)
|
|
13
|
-
* - [Scatter demonstration](https://mui.com/x/react-charts/scatter-demo/)
|
|
14
|
-
*
|
|
15
|
-
* API:
|
|
16
|
-
*
|
|
17
|
-
* - [Scatter API](https://mui.com/x/api/charts/scatter/)
|
|
18
|
-
*/
|
|
19
|
-
function Scatter(props) {
|
|
20
|
-
var series = props.series,
|
|
21
|
-
xScale = props.xScale,
|
|
22
|
-
yScale = props.yScale,
|
|
23
|
-
color = props.color,
|
|
24
|
-
markerSize = props.markerSize,
|
|
25
|
-
onItemClick = props.onItemClick;
|
|
26
|
-
var highlightScope = React.useMemo(function () {
|
|
27
|
-
return _extends({
|
|
28
|
-
highlighted: 'item',
|
|
29
|
-
faded: 'global'
|
|
30
|
-
}, series.highlightScope);
|
|
31
|
-
}, [series.highlightScope]);
|
|
32
|
-
var _React$useContext = React.useContext(InteractionContext),
|
|
33
|
-
item = _React$useContext.item,
|
|
34
|
-
useVoronoiInteraction = _React$useContext.useVoronoiInteraction;
|
|
35
|
-
var skipInteractionHandlers = useVoronoiInteraction || series.disableHover;
|
|
36
|
-
var getInteractionItemProps = useInteractionItemProps(highlightScope, skipInteractionHandlers);
|
|
37
|
-
var cleanData = React.useMemo(function () {
|
|
38
|
-
var getXPosition = getValueToPositionMapper(xScale);
|
|
39
|
-
var getYPosition = getValueToPositionMapper(yScale);
|
|
40
|
-
var xRange = xScale.range();
|
|
41
|
-
var yRange = yScale.range();
|
|
42
|
-
var minXRange = Math.min.apply(Math, _toConsumableArray(xRange));
|
|
43
|
-
var maxXRange = Math.max.apply(Math, _toConsumableArray(xRange));
|
|
44
|
-
var minYRange = Math.min.apply(Math, _toConsumableArray(yRange));
|
|
45
|
-
var maxYRange = Math.max.apply(Math, _toConsumableArray(yRange));
|
|
46
|
-
var temp = [];
|
|
47
|
-
for (var i = 0; i < series.data.length; i += 1) {
|
|
48
|
-
var scatterPoint = series.data[i];
|
|
49
|
-
var x = getXPosition(scatterPoint.x);
|
|
50
|
-
var y = getYPosition(scatterPoint.y);
|
|
51
|
-
var isInRange = x >= minXRange && x <= maxXRange && y >= minYRange && y <= maxYRange;
|
|
52
|
-
var pointCtx = {
|
|
53
|
-
type: 'scatter',
|
|
54
|
-
seriesId: series.id,
|
|
55
|
-
dataIndex: i
|
|
56
|
-
};
|
|
57
|
-
if (isInRange) {
|
|
58
|
-
var isHighlighted = getIsHighlighted(item, pointCtx, highlightScope);
|
|
59
|
-
temp.push({
|
|
60
|
-
x: x,
|
|
61
|
-
y: y,
|
|
62
|
-
isHighlighted: isHighlighted,
|
|
63
|
-
isFaded: !isHighlighted && getIsFaded(item, pointCtx, highlightScope),
|
|
64
|
-
interactionProps: getInteractionItemProps(pointCtx),
|
|
65
|
-
id: scatterPoint.id,
|
|
66
|
-
dataIndex: i
|
|
67
|
-
});
|
|
68
|
-
}
|
|
69
|
-
}
|
|
70
|
-
return temp;
|
|
71
|
-
}, [xScale, yScale, series.data, series.id, item, highlightScope, getInteractionItemProps]);
|
|
72
|
-
return /*#__PURE__*/_jsx("g", {
|
|
73
|
-
children: cleanData.map(function (dataPoint) {
|
|
74
|
-
return /*#__PURE__*/_jsx("circle", _extends({
|
|
75
|
-
cx: 0,
|
|
76
|
-
cy: 0,
|
|
77
|
-
r: (dataPoint.isHighlighted ? 1.2 : 1) * markerSize,
|
|
78
|
-
transform: "translate(".concat(dataPoint.x, ", ").concat(dataPoint.y, ")"),
|
|
79
|
-
fill: color,
|
|
80
|
-
opacity: dataPoint.isFaded && 0.3 || 1,
|
|
81
|
-
onClick: onItemClick && function (event) {
|
|
82
|
-
return onItemClick(event, {
|
|
83
|
-
type: 'scatter',
|
|
84
|
-
seriesId: series.id,
|
|
85
|
-
dataIndex: dataPoint.dataIndex
|
|
86
|
-
});
|
|
87
|
-
},
|
|
88
|
-
cursor: onItemClick ? 'pointer' : 'unset'
|
|
89
|
-
}, dataPoint.interactionProps), dataPoint.id);
|
|
90
|
-
})
|
|
91
|
-
});
|
|
92
|
-
}
|
|
93
|
-
process.env.NODE_ENV !== "production" ? Scatter.propTypes = {
|
|
94
|
-
// ----------------------------- Warning --------------------------------
|
|
95
|
-
// | These PropTypes are generated from the TypeScript type definitions |
|
|
96
|
-
// | To update them edit the TypeScript types and run "yarn proptypes" |
|
|
97
|
-
// ----------------------------------------------------------------------
|
|
98
|
-
color: PropTypes.string.isRequired,
|
|
99
|
-
markerSize: PropTypes.number.isRequired,
|
|
100
|
-
/**
|
|
101
|
-
* Callback fired when clicking on a scatter item.
|
|
102
|
-
* @param {MouseEvent} event Mouse event recorded on the `<svg/>` element.
|
|
103
|
-
* @param {ScatterItemIdentifier} scatterItemIdentifier The scatter item identifier.
|
|
104
|
-
*/
|
|
105
|
-
onItemClick: PropTypes.func,
|
|
106
|
-
series: PropTypes.object.isRequired,
|
|
107
|
-
xScale: PropTypes.func.isRequired,
|
|
108
|
-
yScale: PropTypes.func.isRequired
|
|
109
|
-
} : void 0;
|
|
110
|
-
export { Scatter };
|
|
@@ -1,395 +0,0 @@
|
|
|
1
|
-
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
|
-
import * as React from 'react';
|
|
3
|
-
import PropTypes from 'prop-types';
|
|
4
|
-
import { ScatterPlot } from './ScatterPlot';
|
|
5
|
-
import { ResponsiveChartContainer } from '../ResponsiveChartContainer';
|
|
6
|
-
import { ChartsAxis } from '../ChartsAxis';
|
|
7
|
-
import { ChartsTooltip } from '../ChartsTooltip';
|
|
8
|
-
import { ChartsLegend } from '../ChartsLegend';
|
|
9
|
-
import { ChartsAxisHighlight } from '../ChartsAxisHighlight';
|
|
10
|
-
import { ChartsVoronoiHandler } from '../ChartsVoronoiHandler/ChartsVoronoiHandler';
|
|
11
|
-
import { ChartsGrid } from '../ChartsGrid';
|
|
12
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
13
|
-
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
14
|
-
/**
|
|
15
|
-
* Demos:
|
|
16
|
-
*
|
|
17
|
-
* - [Scatter](https://mui.com/x/react-charts/scatter/)
|
|
18
|
-
* - [Scatter demonstration](https://mui.com/x/react-charts/scatter-demo/)
|
|
19
|
-
*
|
|
20
|
-
* API:
|
|
21
|
-
*
|
|
22
|
-
* - [ScatterChart API](https://mui.com/x/api/charts/scatter-chart/)
|
|
23
|
-
*/
|
|
24
|
-
var ScatterChart = /*#__PURE__*/React.forwardRef(function ScatterChart(props, ref) {
|
|
25
|
-
var xAxis = props.xAxis,
|
|
26
|
-
yAxis = props.yAxis,
|
|
27
|
-
series = props.series,
|
|
28
|
-
tooltip = props.tooltip,
|
|
29
|
-
axisHighlight = props.axisHighlight,
|
|
30
|
-
voronoiMaxRadius = props.voronoiMaxRadius,
|
|
31
|
-
disableVoronoi = props.disableVoronoi,
|
|
32
|
-
legend = props.legend,
|
|
33
|
-
width = props.width,
|
|
34
|
-
height = props.height,
|
|
35
|
-
margin = props.margin,
|
|
36
|
-
colors = props.colors,
|
|
37
|
-
sx = props.sx,
|
|
38
|
-
grid = props.grid,
|
|
39
|
-
topAxis = props.topAxis,
|
|
40
|
-
leftAxis = props.leftAxis,
|
|
41
|
-
rightAxis = props.rightAxis,
|
|
42
|
-
bottomAxis = props.bottomAxis,
|
|
43
|
-
onItemClick = props.onItemClick,
|
|
44
|
-
children = props.children,
|
|
45
|
-
slots = props.slots,
|
|
46
|
-
slotProps = props.slotProps;
|
|
47
|
-
return /*#__PURE__*/_jsxs(ResponsiveChartContainer, {
|
|
48
|
-
ref: ref,
|
|
49
|
-
series: series.map(function (s) {
|
|
50
|
-
return _extends({
|
|
51
|
-
type: 'scatter'
|
|
52
|
-
}, s);
|
|
53
|
-
}),
|
|
54
|
-
width: width,
|
|
55
|
-
height: height,
|
|
56
|
-
margin: margin,
|
|
57
|
-
colors: colors,
|
|
58
|
-
xAxis: xAxis,
|
|
59
|
-
yAxis: yAxis,
|
|
60
|
-
sx: sx,
|
|
61
|
-
children: [!disableVoronoi && /*#__PURE__*/_jsx(ChartsVoronoiHandler, {
|
|
62
|
-
voronoiMaxRadius: voronoiMaxRadius,
|
|
63
|
-
onItemClick: onItemClick
|
|
64
|
-
}), /*#__PURE__*/_jsx(ChartsAxis, {
|
|
65
|
-
topAxis: topAxis,
|
|
66
|
-
leftAxis: leftAxis,
|
|
67
|
-
rightAxis: rightAxis,
|
|
68
|
-
bottomAxis: bottomAxis,
|
|
69
|
-
slots: slots,
|
|
70
|
-
slotProps: slotProps
|
|
71
|
-
}), grid && /*#__PURE__*/_jsx(ChartsGrid, {
|
|
72
|
-
vertical: grid.vertical,
|
|
73
|
-
horizontal: grid.horizontal
|
|
74
|
-
}), /*#__PURE__*/_jsx(ScatterPlot, {
|
|
75
|
-
slots: slots,
|
|
76
|
-
slotProps: slotProps,
|
|
77
|
-
onItemClick: disableVoronoi ? onItemClick : undefined
|
|
78
|
-
}), /*#__PURE__*/_jsx(ChartsLegend, _extends({}, legend, {
|
|
79
|
-
slots: slots,
|
|
80
|
-
slotProps: slotProps
|
|
81
|
-
})), /*#__PURE__*/_jsx(ChartsAxisHighlight, _extends({
|
|
82
|
-
x: "none",
|
|
83
|
-
y: "none"
|
|
84
|
-
}, axisHighlight)), /*#__PURE__*/_jsx(ChartsTooltip, _extends({
|
|
85
|
-
trigger: "item"
|
|
86
|
-
}, tooltip)), children]
|
|
87
|
-
});
|
|
88
|
-
});
|
|
89
|
-
process.env.NODE_ENV !== "production" ? ScatterChart.propTypes = {
|
|
90
|
-
// ----------------------------- Warning --------------------------------
|
|
91
|
-
// | These PropTypes are generated from the TypeScript type definitions |
|
|
92
|
-
// | To update them edit the TypeScript types and run "yarn proptypes" |
|
|
93
|
-
// ----------------------------------------------------------------------
|
|
94
|
-
/**
|
|
95
|
-
* The configuration of axes highlight.
|
|
96
|
-
* @see See {@link https://mui.com/x/react-charts/tooltip/#highlights highlight docs} for more details.
|
|
97
|
-
* @default { x: 'none', y: 'none' }
|
|
98
|
-
*/
|
|
99
|
-
axisHighlight: PropTypes.shape({
|
|
100
|
-
x: PropTypes.oneOf(['band', 'line', 'none']),
|
|
101
|
-
y: PropTypes.oneOf(['band', 'line', 'none'])
|
|
102
|
-
}),
|
|
103
|
-
/**
|
|
104
|
-
* Indicate which axis to display the bottom of the charts.
|
|
105
|
-
* Can be a string (the id of the axis) or an object `ChartsXAxisProps`.
|
|
106
|
-
* @default xAxisIds[0] The id of the first provided axis
|
|
107
|
-
*/
|
|
108
|
-
bottomAxis: PropTypes.oneOfType([PropTypes.shape({
|
|
109
|
-
axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
|
110
|
-
classes: PropTypes.object,
|
|
111
|
-
disableLine: PropTypes.bool,
|
|
112
|
-
disableTicks: PropTypes.bool,
|
|
113
|
-
fill: PropTypes.string,
|
|
114
|
-
label: PropTypes.string,
|
|
115
|
-
labelFontSize: PropTypes.number,
|
|
116
|
-
labelStyle: PropTypes.object,
|
|
117
|
-
position: PropTypes.oneOf(['bottom', 'top']),
|
|
118
|
-
slotProps: PropTypes.object,
|
|
119
|
-
slots: PropTypes.object,
|
|
120
|
-
stroke: PropTypes.string,
|
|
121
|
-
tickFontSize: PropTypes.number,
|
|
122
|
-
tickInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.array, PropTypes.func]),
|
|
123
|
-
tickLabelInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.func]),
|
|
124
|
-
tickLabelStyle: PropTypes.object,
|
|
125
|
-
tickMaxStep: PropTypes.number,
|
|
126
|
-
tickMinStep: PropTypes.number,
|
|
127
|
-
tickNumber: PropTypes.number,
|
|
128
|
-
tickSize: PropTypes.number
|
|
129
|
-
}), PropTypes.string]),
|
|
130
|
-
children: PropTypes.node,
|
|
131
|
-
className: PropTypes.string,
|
|
132
|
-
/**
|
|
133
|
-
* Color palette used to colorize multiple series.
|
|
134
|
-
* @default blueberryTwilightPalette
|
|
135
|
-
*/
|
|
136
|
-
colors: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.string), PropTypes.func]),
|
|
137
|
-
/**
|
|
138
|
-
* An array of objects that can be used to populate series and axes data using their `dataKey` property.
|
|
139
|
-
*/
|
|
140
|
-
dataset: PropTypes.arrayOf(PropTypes.object),
|
|
141
|
-
desc: PropTypes.string,
|
|
142
|
-
/**
|
|
143
|
-
* If `true`, the charts will not listen to the mouse move event.
|
|
144
|
-
* It might break interactive features, but will improve performance.
|
|
145
|
-
* @default false
|
|
146
|
-
*/
|
|
147
|
-
disableAxisListener: PropTypes.bool,
|
|
148
|
-
/**
|
|
149
|
-
* If true, the interaction will not use the Voronoi cell and fall back to hover events.
|
|
150
|
-
* @default false
|
|
151
|
-
*/
|
|
152
|
-
disableVoronoi: PropTypes.bool,
|
|
153
|
-
/**
|
|
154
|
-
* Option to display a cartesian grid in the background.
|
|
155
|
-
*/
|
|
156
|
-
grid: PropTypes.shape({
|
|
157
|
-
horizontal: PropTypes.bool,
|
|
158
|
-
vertical: PropTypes.bool
|
|
159
|
-
}),
|
|
160
|
-
/**
|
|
161
|
-
* The height of the chart in px. If not defined, it takes the height of the parent element.
|
|
162
|
-
* @default undefined
|
|
163
|
-
*/
|
|
164
|
-
height: PropTypes.number,
|
|
165
|
-
/**
|
|
166
|
-
* Indicate which axis to display the left of the charts.
|
|
167
|
-
* Can be a string (the id of the axis) or an object `ChartsYAxisProps`.
|
|
168
|
-
* @default yAxisIds[0] The id of the first provided axis
|
|
169
|
-
*/
|
|
170
|
-
leftAxis: PropTypes.oneOfType([PropTypes.shape({
|
|
171
|
-
axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
|
172
|
-
classes: PropTypes.object,
|
|
173
|
-
disableLine: PropTypes.bool,
|
|
174
|
-
disableTicks: PropTypes.bool,
|
|
175
|
-
fill: PropTypes.string,
|
|
176
|
-
label: PropTypes.string,
|
|
177
|
-
labelFontSize: PropTypes.number,
|
|
178
|
-
labelStyle: PropTypes.object,
|
|
179
|
-
position: PropTypes.oneOf(['left', 'right']),
|
|
180
|
-
slotProps: PropTypes.object,
|
|
181
|
-
slots: PropTypes.object,
|
|
182
|
-
stroke: PropTypes.string,
|
|
183
|
-
tickFontSize: PropTypes.number,
|
|
184
|
-
tickInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.array, PropTypes.func]),
|
|
185
|
-
tickLabelInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.func]),
|
|
186
|
-
tickLabelStyle: PropTypes.object,
|
|
187
|
-
tickMaxStep: PropTypes.number,
|
|
188
|
-
tickMinStep: PropTypes.number,
|
|
189
|
-
tickNumber: PropTypes.number,
|
|
190
|
-
tickSize: PropTypes.number
|
|
191
|
-
}), PropTypes.string]),
|
|
192
|
-
/**
|
|
193
|
-
* @deprecated Consider using `slotProps.legend` instead.
|
|
194
|
-
*/
|
|
195
|
-
legend: PropTypes.shape({
|
|
196
|
-
classes: PropTypes.object,
|
|
197
|
-
direction: PropTypes.oneOf(['column', 'row']),
|
|
198
|
-
hidden: PropTypes.bool,
|
|
199
|
-
position: PropTypes.shape({
|
|
200
|
-
horizontal: PropTypes.oneOf(['left', 'middle', 'right']).isRequired,
|
|
201
|
-
vertical: PropTypes.oneOf(['bottom', 'middle', 'top']).isRequired
|
|
202
|
-
}),
|
|
203
|
-
slotProps: PropTypes.object,
|
|
204
|
-
slots: PropTypes.object
|
|
205
|
-
}),
|
|
206
|
-
/**
|
|
207
|
-
* The margin between the SVG and the drawing area.
|
|
208
|
-
* It's used for leaving some space for extra information such as the x- and y-axis or legend.
|
|
209
|
-
* Accepts an object with the optional properties: `top`, `bottom`, `left`, and `right`.
|
|
210
|
-
* @default object Depends on the charts type.
|
|
211
|
-
*/
|
|
212
|
-
margin: PropTypes.shape({
|
|
213
|
-
bottom: PropTypes.number,
|
|
214
|
-
left: PropTypes.number,
|
|
215
|
-
right: PropTypes.number,
|
|
216
|
-
top: PropTypes.number
|
|
217
|
-
}),
|
|
218
|
-
/**
|
|
219
|
-
* Callback fired when clicking on a scatter item.
|
|
220
|
-
* @param {MouseEvent} event The mouse event recorded on the `<svg/>` element if using Voronoi cells. Or the Mouse event from the scatter element, when `disableVoronoi=true`.
|
|
221
|
-
* @param {ScatterItemIdentifier} scatterItemIdentifier The scatter item identifier.
|
|
222
|
-
*/
|
|
223
|
-
onItemClick: PropTypes.func,
|
|
224
|
-
/**
|
|
225
|
-
* Indicate which axis to display the right of the charts.
|
|
226
|
-
* Can be a string (the id of the axis) or an object `ChartsYAxisProps`.
|
|
227
|
-
* @default null
|
|
228
|
-
*/
|
|
229
|
-
rightAxis: PropTypes.oneOfType([PropTypes.shape({
|
|
230
|
-
axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
|
231
|
-
classes: PropTypes.object,
|
|
232
|
-
disableLine: PropTypes.bool,
|
|
233
|
-
disableTicks: PropTypes.bool,
|
|
234
|
-
fill: PropTypes.string,
|
|
235
|
-
label: PropTypes.string,
|
|
236
|
-
labelFontSize: PropTypes.number,
|
|
237
|
-
labelStyle: PropTypes.object,
|
|
238
|
-
position: PropTypes.oneOf(['left', 'right']),
|
|
239
|
-
slotProps: PropTypes.object,
|
|
240
|
-
slots: PropTypes.object,
|
|
241
|
-
stroke: PropTypes.string,
|
|
242
|
-
tickFontSize: PropTypes.number,
|
|
243
|
-
tickInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.array, PropTypes.func]),
|
|
244
|
-
tickLabelInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.func]),
|
|
245
|
-
tickLabelStyle: PropTypes.object,
|
|
246
|
-
tickMaxStep: PropTypes.number,
|
|
247
|
-
tickMinStep: PropTypes.number,
|
|
248
|
-
tickNumber: PropTypes.number,
|
|
249
|
-
tickSize: PropTypes.number
|
|
250
|
-
}), PropTypes.string]),
|
|
251
|
-
/**
|
|
252
|
-
* The series to display in the scatter chart.
|
|
253
|
-
*/
|
|
254
|
-
series: PropTypes.arrayOf(PropTypes.object).isRequired,
|
|
255
|
-
/**
|
|
256
|
-
* The props used for each component slot.
|
|
257
|
-
* @default {}
|
|
258
|
-
*/
|
|
259
|
-
slotProps: PropTypes.object,
|
|
260
|
-
/**
|
|
261
|
-
* Overridable component slots.
|
|
262
|
-
* @default {}
|
|
263
|
-
*/
|
|
264
|
-
slots: PropTypes.object,
|
|
265
|
-
sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
|
|
266
|
-
title: PropTypes.string,
|
|
267
|
-
/**
|
|
268
|
-
* The configuration of the tooltip.
|
|
269
|
-
* @see See {@link https://mui.com/x/react-charts/tooltip/ tooltip docs} for more details.
|
|
270
|
-
* @default { trigger: 'item' }
|
|
271
|
-
*/
|
|
272
|
-
tooltip: PropTypes.shape({
|
|
273
|
-
axisContent: PropTypes.elementType,
|
|
274
|
-
classes: PropTypes.object,
|
|
275
|
-
itemContent: PropTypes.elementType,
|
|
276
|
-
slotProps: PropTypes.object,
|
|
277
|
-
slots: PropTypes.object,
|
|
278
|
-
trigger: PropTypes.oneOf(['axis', 'item', 'none'])
|
|
279
|
-
}),
|
|
280
|
-
/**
|
|
281
|
-
* Indicate which axis to display the top of the charts.
|
|
282
|
-
* Can be a string (the id of the axis) or an object `ChartsXAxisProps`.
|
|
283
|
-
* @default null
|
|
284
|
-
*/
|
|
285
|
-
topAxis: PropTypes.oneOfType([PropTypes.shape({
|
|
286
|
-
axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
|
287
|
-
classes: PropTypes.object,
|
|
288
|
-
disableLine: PropTypes.bool,
|
|
289
|
-
disableTicks: PropTypes.bool,
|
|
290
|
-
fill: PropTypes.string,
|
|
291
|
-
label: PropTypes.string,
|
|
292
|
-
labelFontSize: PropTypes.number,
|
|
293
|
-
labelStyle: PropTypes.object,
|
|
294
|
-
position: PropTypes.oneOf(['bottom', 'top']),
|
|
295
|
-
slotProps: PropTypes.object,
|
|
296
|
-
slots: PropTypes.object,
|
|
297
|
-
stroke: PropTypes.string,
|
|
298
|
-
tickFontSize: PropTypes.number,
|
|
299
|
-
tickInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.array, PropTypes.func]),
|
|
300
|
-
tickLabelInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.func]),
|
|
301
|
-
tickLabelStyle: PropTypes.object,
|
|
302
|
-
tickMaxStep: PropTypes.number,
|
|
303
|
-
tickMinStep: PropTypes.number,
|
|
304
|
-
tickNumber: PropTypes.number,
|
|
305
|
-
tickSize: PropTypes.number
|
|
306
|
-
}), PropTypes.string]),
|
|
307
|
-
viewBox: PropTypes.shape({
|
|
308
|
-
height: PropTypes.number,
|
|
309
|
-
width: PropTypes.number,
|
|
310
|
-
x: PropTypes.number,
|
|
311
|
-
y: PropTypes.number
|
|
312
|
-
}),
|
|
313
|
-
/**
|
|
314
|
-
* Defines the maximal distance between a scatter point and the pointer that triggers the interaction.
|
|
315
|
-
* If `undefined`, the radius is assumed to be infinite.
|
|
316
|
-
* @default undefined
|
|
317
|
-
*/
|
|
318
|
-
voronoiMaxRadius: PropTypes.number,
|
|
319
|
-
/**
|
|
320
|
-
* The width of the chart in px. If not defined, it takes the width of the parent element.
|
|
321
|
-
* @default undefined
|
|
322
|
-
*/
|
|
323
|
-
width: PropTypes.number,
|
|
324
|
-
/**
|
|
325
|
-
* The configuration of the x-axes.
|
|
326
|
-
* If not provided, a default axis config is used with id set to `DEFAULT_X_AXIS_KEY`.
|
|
327
|
-
*/
|
|
328
|
-
xAxis: PropTypes.arrayOf(PropTypes.shape({
|
|
329
|
-
axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
|
330
|
-
classes: PropTypes.object,
|
|
331
|
-
data: PropTypes.array,
|
|
332
|
-
dataKey: PropTypes.string,
|
|
333
|
-
disableLine: PropTypes.bool,
|
|
334
|
-
disableTicks: PropTypes.bool,
|
|
335
|
-
fill: PropTypes.string,
|
|
336
|
-
hideTooltip: PropTypes.bool,
|
|
337
|
-
id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
|
338
|
-
label: PropTypes.string,
|
|
339
|
-
labelFontSize: PropTypes.number,
|
|
340
|
-
labelStyle: PropTypes.object,
|
|
341
|
-
max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
|
|
342
|
-
min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
|
|
343
|
-
position: PropTypes.oneOf(['bottom', 'left', 'right', 'top']),
|
|
344
|
-
reverse: PropTypes.bool,
|
|
345
|
-
scaleType: PropTypes.oneOf(['band', 'linear', 'log', 'point', 'pow', 'sqrt', 'time', 'utc']),
|
|
346
|
-
slotProps: PropTypes.object,
|
|
347
|
-
slots: PropTypes.object,
|
|
348
|
-
stroke: PropTypes.string,
|
|
349
|
-
tickFontSize: PropTypes.number,
|
|
350
|
-
tickInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.array, PropTypes.func]),
|
|
351
|
-
tickLabelInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.func]),
|
|
352
|
-
tickLabelStyle: PropTypes.object,
|
|
353
|
-
tickMaxStep: PropTypes.number,
|
|
354
|
-
tickMinStep: PropTypes.number,
|
|
355
|
-
tickNumber: PropTypes.number,
|
|
356
|
-
tickSize: PropTypes.number,
|
|
357
|
-
valueFormatter: PropTypes.func
|
|
358
|
-
})),
|
|
359
|
-
/**
|
|
360
|
-
* The configuration of the y-axes.
|
|
361
|
-
* If not provided, a default axis config is used with id set to `DEFAULT_Y_AXIS_KEY`.
|
|
362
|
-
*/
|
|
363
|
-
yAxis: PropTypes.arrayOf(PropTypes.shape({
|
|
364
|
-
axisId: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
|
365
|
-
classes: PropTypes.object,
|
|
366
|
-
data: PropTypes.array,
|
|
367
|
-
dataKey: PropTypes.string,
|
|
368
|
-
disableLine: PropTypes.bool,
|
|
369
|
-
disableTicks: PropTypes.bool,
|
|
370
|
-
fill: PropTypes.string,
|
|
371
|
-
hideTooltip: PropTypes.bool,
|
|
372
|
-
id: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
|
|
373
|
-
label: PropTypes.string,
|
|
374
|
-
labelFontSize: PropTypes.number,
|
|
375
|
-
labelStyle: PropTypes.object,
|
|
376
|
-
max: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
|
|
377
|
-
min: PropTypes.oneOfType([PropTypes.instanceOf(Date), PropTypes.number]),
|
|
378
|
-
position: PropTypes.oneOf(['bottom', 'left', 'right', 'top']),
|
|
379
|
-
reverse: PropTypes.bool,
|
|
380
|
-
scaleType: PropTypes.oneOf(['band', 'linear', 'log', 'point', 'pow', 'sqrt', 'time', 'utc']),
|
|
381
|
-
slotProps: PropTypes.object,
|
|
382
|
-
slots: PropTypes.object,
|
|
383
|
-
stroke: PropTypes.string,
|
|
384
|
-
tickFontSize: PropTypes.number,
|
|
385
|
-
tickInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.array, PropTypes.func]),
|
|
386
|
-
tickLabelInterval: PropTypes.oneOfType([PropTypes.oneOf(['auto']), PropTypes.func]),
|
|
387
|
-
tickLabelStyle: PropTypes.object,
|
|
388
|
-
tickMaxStep: PropTypes.number,
|
|
389
|
-
tickMinStep: PropTypes.number,
|
|
390
|
-
tickNumber: PropTypes.number,
|
|
391
|
-
tickSize: PropTypes.number,
|
|
392
|
-
valueFormatter: PropTypes.func
|
|
393
|
-
}))
|
|
394
|
-
} : void 0;
|
|
395
|
-
export { ScatterChart };
|
|
@@ -1,80 +0,0 @@
|
|
|
1
|
-
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
|
-
import * as React from 'react';
|
|
3
|
-
import PropTypes from 'prop-types';
|
|
4
|
-
import { Scatter } from './Scatter';
|
|
5
|
-
import { SeriesContext } from '../context/SeriesContextProvider';
|
|
6
|
-
import { CartesianContext } from '../context/CartesianContextProvider';
|
|
7
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
8
|
-
/**
|
|
9
|
-
* Demos:
|
|
10
|
-
*
|
|
11
|
-
* - [Scatter](https://mui.com/x/react-charts/scatter/)
|
|
12
|
-
* - [Scatter demonstration](https://mui.com/x/react-charts/scatter-demo/)
|
|
13
|
-
*
|
|
14
|
-
* API:
|
|
15
|
-
*
|
|
16
|
-
* - [ScatterPlot API](https://mui.com/x/api/charts/scatter-plot/)
|
|
17
|
-
*/
|
|
18
|
-
function ScatterPlot(props) {
|
|
19
|
-
var _slots$scatter;
|
|
20
|
-
var slots = props.slots,
|
|
21
|
-
slotProps = props.slotProps,
|
|
22
|
-
onItemClick = props.onItemClick;
|
|
23
|
-
var seriesData = React.useContext(SeriesContext).scatter;
|
|
24
|
-
var axisData = React.useContext(CartesianContext);
|
|
25
|
-
if (seriesData === undefined) {
|
|
26
|
-
return null;
|
|
27
|
-
}
|
|
28
|
-
var series = seriesData.series,
|
|
29
|
-
seriesOrder = seriesData.seriesOrder;
|
|
30
|
-
var xAxis = axisData.xAxis,
|
|
31
|
-
yAxis = axisData.yAxis,
|
|
32
|
-
xAxisIds = axisData.xAxisIds,
|
|
33
|
-
yAxisIds = axisData.yAxisIds;
|
|
34
|
-
var defaultXAxisId = xAxisIds[0];
|
|
35
|
-
var defaultYAxisId = yAxisIds[0];
|
|
36
|
-
var ScatterItems = (_slots$scatter = slots == null ? void 0 : slots.scatter) != null ? _slots$scatter : Scatter;
|
|
37
|
-
return /*#__PURE__*/_jsx(React.Fragment, {
|
|
38
|
-
children: seriesOrder.map(function (seriesId) {
|
|
39
|
-
var _series$seriesId = series[seriesId],
|
|
40
|
-
id = _series$seriesId.id,
|
|
41
|
-
xAxisKey = _series$seriesId.xAxisKey,
|
|
42
|
-
yAxisKey = _series$seriesId.yAxisKey,
|
|
43
|
-
markerSize = _series$seriesId.markerSize,
|
|
44
|
-
color = _series$seriesId.color;
|
|
45
|
-
var xScale = xAxis[xAxisKey != null ? xAxisKey : defaultXAxisId].scale;
|
|
46
|
-
var yScale = yAxis[yAxisKey != null ? yAxisKey : defaultYAxisId].scale;
|
|
47
|
-
return /*#__PURE__*/_jsx(ScatterItems, _extends({
|
|
48
|
-
xScale: xScale,
|
|
49
|
-
yScale: yScale,
|
|
50
|
-
color: color,
|
|
51
|
-
markerSize: markerSize != null ? markerSize : 4,
|
|
52
|
-
series: series[seriesId],
|
|
53
|
-
onItemClick: onItemClick
|
|
54
|
-
}, slotProps == null ? void 0 : slotProps.scatter), id);
|
|
55
|
-
})
|
|
56
|
-
});
|
|
57
|
-
}
|
|
58
|
-
process.env.NODE_ENV !== "production" ? ScatterPlot.propTypes = {
|
|
59
|
-
// ----------------------------- Warning --------------------------------
|
|
60
|
-
// | These PropTypes are generated from the TypeScript type definitions |
|
|
61
|
-
// | To update them edit the TypeScript types and run "yarn proptypes" |
|
|
62
|
-
// ----------------------------------------------------------------------
|
|
63
|
-
/**
|
|
64
|
-
* Callback fired when clicking on a scatter item.
|
|
65
|
-
* @param {MouseEvent} event Mouse event recorded on the `<svg/>` element.
|
|
66
|
-
* @param {ScatterItemIdentifier} scatterItemIdentifier The scatter item identifier.
|
|
67
|
-
*/
|
|
68
|
-
onItemClick: PropTypes.func,
|
|
69
|
-
/**
|
|
70
|
-
* The props used for each component slot.
|
|
71
|
-
* @default {}
|
|
72
|
-
*/
|
|
73
|
-
slotProps: PropTypes.object,
|
|
74
|
-
/**
|
|
75
|
-
* Overridable component slots.
|
|
76
|
-
* @default {}
|
|
77
|
-
*/
|
|
78
|
-
slots: PropTypes.object
|
|
79
|
-
} : void 0;
|
|
80
|
-
export { ScatterPlot };
|