跳到内容

ChartsYAxisAPI

React ChartsYAxis 组件的 API 参考文档。了解此导出模块的 props、CSS 和其他 API。

演示

导入

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

通过阅读关于最小化 bundle size 的指南了解更多信息。

Props

名称类型默认描述
axisIdnumber
| string
-

要渲染的坐标轴的 id。如果未定义,则为第一个定义的坐标轴。

classesobject-

覆盖或扩展应用于组件的样式。

请参阅下面的 CSS 类 API 以了解更多详情。

disableLineboolfalse

如果为 true,则禁用轴线。

disableTicksboolfalse

如果为 true,则禁用刻度线。

fillstring'currentColor'

轴文本的填充颜色。

labelstring-

坐标轴的标签。

labelFontSizenumber14

轴标签的字体大小。

labelStyleobject-

应用于轴标签的样式。

position'left'
| 'right'
-

坐标轴的位置。

slotPropsobject{}

用于每个组件插槽的 props。

slotsobject{}

可覆盖的组件插槽。

请参阅下面的 Slots API 以了解更多详情。

strokestring'currentColor'

轴线的描边颜色。

tickFontSizenumber12

轴刻度线文本的字体大小。

tickInterval'auto'
| array
| func
'auto'

定义显示哪些刻度线。其值可以是:- 'auto' 在这种情况下,刻度线是根据轴比例和其他参数计算的。- 形式为 (value, index) => boolean 的过滤函数,仅当轴具有“point”比例时才可用。- 包含应显示刻度线的值的数组。

tickLabelInterval'auto'
| func
'auto'

定义哪些刻度线显示其标签。其值可以是:- 'auto' 在这种情况下,如果标签不与前一个标签重叠,则会显示标签。- 形式为 (value, index) => boolean 的过滤函数。警告:索引是刻度线索引,而不是数据索引。

tickLabelPlacement'middle'
| 'tick'
'middle'

刻度线标签的位置。可以是 band 的中间,也可以是刻度线位置。仅当比例为 'band' 时使用。

tickLabelStyleobject-

应用于刻度线文本的样式。

tickMaxStepnumber-

两个刻度线之间的最大步长。当使用时间数据时,该值被假定为毫秒。分类轴(band、points)不支持。

tickMinStepnumber-

两个刻度线之间的最小步长。当使用时间数据时,该值被假定为毫秒。分类轴(band、points)不支持。

tickNumbernumber-

刻度线的数量。此数量不能保证。分类轴(band、points)不支持。

tickPlacement'end'
| 'extremities'
| 'middle'
| 'start'
'extremities'

刻度线相对于 band 区间的位置。仅当比例为 'band' 时使用。

tickSizenumber6

刻度线的大小。

该组件不能持有 ref。

CSS 类

这些类名对于使用 CSS 设置样式很有用。当触发特定状态时,它们将应用于组件的插槽。

类名规则名称描述
.MuiChartsYAxis-bottombottom应用于底部轴的样式。
.MuiChartsYAxis-directionXdirectionX应用于 x 轴的样式。
.MuiChartsYAxis-directionYdirectionY应用于 y 轴的样式。
.MuiChartsYAxis-labellabelStyles applied to the group containing the axis label.
.MuiChartsYAxis-leftleft应用于左侧轴的样式。
.MuiChartsYAxis-lineline应用于主线元素的样式。
.MuiChartsYAxis-rightright应用于右侧轴的样式。
.MuiChartsYAxis-rootroot应用于根元素的样式。
.MuiChartsYAxis-ticktick应用于刻度线的样式。
.MuiChartsYAxis-tickContainertickContainer应用于包含刻度线及其标签的组的样式。
.MuiChartsYAxis-tickLabeltickLabel应用于刻度线标签的样式。
.MuiChartsYAxis-toptop应用于顶部轴的样式。

您可以使用以下自定义选项之一来覆盖组件的样式

源代码

如果您在此页面中找不到所需的信息,请考虑查看组件的实现以获取更多详细信息。