跳到内容

ContinuousColorLegendAPI

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

演示

导入

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

通过阅读本关于最小化捆绑包大小的指南，了解它们之间的区别。

Props

名称类型默认值描述
align'end'
| 'middle'
| 'start'		'middle'

文本相对于渐变条的对齐方式。

axisDirection'x'
| 'y'
| 'z'		'z'

包含要表示的颜色配置的轴方向。

axisIdnumber
| string		第一个轴项目。

具有要表示的颜色配置的轴项目的 ID。

direction'column'
| 'row'		-

图例布局的方向。默认值取决于图表。

idstring自动生成的 ID

渐变的唯一标识符。

labelStyleobjecttheme.typography.subtitle1

应用于标签的样式。

lengthnumber
| string		'50%'

渐变条的长度。可以是数字（以 px 为单位）或带有百分比的字符串，例如 '50%'。 '100%' 是 svg 的长度。

maxLabelfunc
| string		({ formattedValue }) => formattedValue

在渐变最大侧显示的标签。可以是字符串或函数。如果未定义，则显示格式化的最大值。

minLabelfunc
| string		({ formattedValue }) => formattedValue

在渐变最小侧显示的标签。可以是字符串或函数。

position{ horizontal: 'left'
| 'middle'
| 'right', vertical: 'bottom'
| 'middle'
| 'top' }		-

图例的位置。

scaleType'linear'
| 'log'
| 'pow'
| 'sqrt'
| 'time'
| 'utc'		'linear'

用于显示渐变颜色的比例。

spacingnumber4

渐变条和标签之间的间距。

thicknessnumber5

渐变条的粗细。

该组件无法保存 ref。

源代码

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