@mui/x-charts
Version:
The community edition of MUI X Charts components.
99 lines (98 loc) • 2.94 kB
JavaScript
'use client';
import _extends from "@babel/runtime/helpers/esm/extends";
import * as React from 'react';
import PropTypes from 'prop-types';
import { Scatter } from "./Scatter.js";
import { useScatterSeriesContext } from "../hooks/useScatterSeries.js";
import getColor from "./seriesConfig/getColor.js";
import { useXAxes, useYAxes } from "../hooks/index.js";
import { useZAxes } from "../hooks/useZAxis.js";
import { jsx as _jsx } from "react/jsx-runtime";
/**
* Demos:
*
* - [Scatter](https://mui.com/x/react-charts/scatter/)
* - [Scatter demonstration](https://mui.com/x/react-charts/scatter-demo/)
*
* API:
*
* - [ScatterPlot API](https://mui.com/x/api/charts/scatter-plot/)
*/
function ScatterPlot(props) {
const {
slots,
slotProps,
onItemClick
} = props;
const seriesData = useScatterSeriesContext();
const {
xAxis,
xAxisIds
} = useXAxes();
const {
yAxis,
yAxisIds
} = useYAxes();
const {
zAxis,
zAxisIds
} = useZAxes();
if (seriesData === undefined) {
return null;
}
const {
series,
seriesOrder
} = seriesData;
const defaultXAxisId = xAxisIds[0];
const defaultYAxisId = yAxisIds[0];
const defaultZAxisId = zAxisIds[0];
const ScatterItems = slots?.scatter ?? Scatter;
return /*#__PURE__*/_jsx(React.Fragment, {
children: seriesOrder.map(seriesId => {
const {
id,
xAxisId,
yAxisId,
zAxisId,
color
} = series[seriesId];
const colorGetter = getColor(series[seriesId], xAxis[xAxisId ?? defaultXAxisId], yAxis[yAxisId ?? defaultYAxisId], zAxis[zAxisId ?? defaultZAxisId]);
const xScale = xAxis[xAxisId ?? defaultXAxisId].scale;
const yScale = yAxis[yAxisId ?? defaultYAxisId].scale;
return /*#__PURE__*/_jsx(ScatterItems, _extends({
xScale: xScale,
yScale: yScale,
color: color,
colorGetter: colorGetter,
series: series[seriesId],
onItemClick: onItemClick,
slots: slots,
slotProps: slotProps
}, slotProps?.scatter), id);
})
});
}
process.env.NODE_ENV !== "production" ? ScatterPlot.propTypes = {
// ----------------------------- Warning --------------------------------
// | These PropTypes are generated from the TypeScript type definitions |
// | To update them edit the TypeScript types and run "pnpm proptypes" |
// ----------------------------------------------------------------------
/**
* Callback fired when clicking on a scatter item.
* @param {MouseEvent} event Mouse event recorded on the `<svg/>` element.
* @param {ScatterItemIdentifier} scatterItemIdentifier The scatter item identifier.
*/
onItemClick: PropTypes.func,
/**
* The props used for each component slot.
* @default {}
*/
slotProps: PropTypes.object,
/**
* Overridable component slots.
* @default {}
*/
slots: PropTypes.object
} : void 0;
export { ScatterPlot };