Skip to content

BarPlot API

API reference docs for the React BarPlot component. Learn about the props, CSS, and other APIs of this exported module.

Demos

Import

import { BarPlot } from '@mui/x-charts/BarChart';
// or
import { BarPlot } from '@mui/x-charts';
// or
import { BarPlot } from '@mui/x-charts-pro';

Learn about the difference by reading this guide on minimizing bundle size.

Props

NameTypeDefaultDescription
barLabel'value'
| func
-

If provided, the function will be used to format the label of the bar. It can be set to 'value' to display the current value.

borderRadiusnumber-

Defines the border radius of the bar element.

onItemClickfunc-

Callback fired when a bar item is clicked.

Signature:function(event: React.MouseEvent, barItemIdentifier: BarItemIdentifier) => void
  • event The event source of the callback.
  • barItemIdentifier The bar item identifier.
skipAnimationboolfalse

If true, animations are skipped.

slotPropsobject{}

The props used for each component slot.

slotsobject{}

Overridable component slots.

See Slots API below for more details.

The component cannot hold a ref.

Slots

Slot nameClass nameDefault componentDescription
barBarElementPathThe component that renders the bar.
barLabelBarLabelThe component that renders the bar label.