useDataset

Access the dataset used to populate series and axes data.

The useDataset hook provides access to the dataset array that was passed to the chart. This is useful when you need to access the raw data for custom components or calculations.

To access the computed series and axes data, use the useSeries and useAxes hooks instead.

Usage

import { useDataset } from '@mui/x-charts/hooks';

function CustomComponent() {
  const dataset = useDataset();
  // Access the raw dataset array
}

The hook returns the dataset array that was passed to the dataset prop of the chart, or undefined if no dataset was provided.

Basic example

This example demonstrates using the useDataset hook to display dataset statistics above a chart:

Advanced example

This example shows how to use the dataset to create a custom data table that synchronizes with the chart:

Return value

The hook returns:

The DatasetType is an array of objects where each object represents a data point with various properties. For example:

const dataset = [
  { month: 'Jan', sales: 100, expenses: 80 },
  { month: 'Feb', sales: 150, expenses: 90 },
  { month: 'Mar', sales: 120, expenses: 70 },
];

When to use

The useDataset hook is particularly useful when:

• Creating custom components that need access to the raw data
• Building data tables or summaries alongside your charts
• Performing calculations on the full dataset

Caveats

This hook must be used within a chart context. See the hooks overview for more information about proper usage.