LineChart

LineChartは、複数のデータを比較するためのラインチャートを描画するコンポーネントです。

ソース @yamada-ui/charts

Props

LineChartProps

説明

Chart data.

タイプ

Dict<any>[]

説明

The key of a group of data which should be unique in an chart.

タイプ

string

説明

An array of objects with dataKey and color keys. Determines which data should be consumed from the data array.

タイプ

LineProps[]

説明

Props passed down to recharts LineChart component.

タイプ

LineChartProps

説明

The visual color appearance of the component.

タイプ

"blackAlpha" | "whiteAlpha" | "amber" | "blue" | "info" | "link" | "primary" | "cyan" | "emerald" | "flashy" | "fuchsia" | "gray" | "green" | "success" | "indigo" | "lime" | "neutral" | "orange" | "warning" | "pink" | "purple" | "red" | "danger" | "rose" | "sky" | "teal" | "violet" | "secondary" | "yellow"

説明

Determines whether points with null values should be connected.

タイプ

boolean

デフォルト

true

説明

Props passed down to recharts ResponsiveContainer component.

タイプ

ResponsiveContainerProps

説明

Type of the curve.

タイプ

ChartCurveType

デフォルト

`monotone`

説明

Controls fill opacity of all lines.

タイプ

number | [number, number]

デフォルト

1

説明

Specifies which lines should be displayed in the grid.

タイプ

ChartAxisType

デフォルト

'x'

説明

Props passed down to recharts 'CartesianGrid' component.

タイプ

GridProps

説明

A function to format labels on inside the tooltip.

タイプ

(label: string) => string

説明

Chart orientation.

タイプ

ChartLayoutType

デフォルト

'horizontal'

説明

Props passed down to recharts 'Legend' component.

タイプ

LegendProps

説明

Props for the lines.

タイプ

Partial<LineProps>

説明

Reference lines that should be displayed on the chart.

タイプ

ReferenceLineProps[]

説明

The size of the LineChart.

タイプ

"sm" | "md" | "lg" | "full"

デフォルト

"full"

説明

Dash array for the grid lines and cursor. The first number is the length of the solid line section and the second number is the length of the interval.

タイプ

string | number

デフォルト

'5 5'

説明

Stroke width for the chart lines.

タイプ

number

デフォルト

2

説明

If any two categorical charts have the same syncId, these two charts can sync the position tooltip, and the startIndex, endIndex of Brush.

タイプ

string | number

説明

The option is the configuration of tick lines.

タイプ

ChartAxisType

デフォルト

'y'

説明

Specifies the duration of animation, the unit of this option is ms.

タイプ

number

デフォルト

0

説明

Props passed down to recharts 'Tooltip' component.

タイプ

TooltipProps

説明

Controls how chart areas are positioned relative to each other

タイプ

AreaChartType

デフォルト

`default`

説明

Unit displayed next to each tick in y-axis.

タイプ

string

説明

A function to format values on inside the tooltip.

タイプ

(value: any) => string

説明

The variant of the LineChart.

タイプ

string

説明

Determines whether activeDots should be displayed.

タイプ

boolean

デフォルト

true

説明

Determines whether dots should be displayed.

タイプ

boolean

デフォルト

true

説明

If true, legend is visible.

タイプ

boolean

デフォルト

false

説明

If true, tooltip is visible.

タイプ

boolean

デフォルト

true

説明

If true, X axis is visible.

タイプ

boolean

デフォルト

true

説明

If true, Y axis is visible.

タイプ

boolean

デフォルト

true

説明

A label to display below the X axis.

タイプ

string

説明

Props passed down to recharts 'XAxisLabel' component.

タイプ

LabelProps

説明

Props passed down to recharts 'XAxis' component.

タイプ

XAxisProps

説明

A function to format X axis tick.

タイプ

(value: any) => string

説明

A label to display below the Y axis.

タイプ

string

説明

Props passed down to recharts 'YAxisLabel' component.

タイプ

LabelProps

説明

Props passed down to recharts 'YAxis' component.

タイプ

YAxisProps

説明

A function to format Y axis tick.

タイプ

(value: any) => string

LineProps

タイプ

DotProps

タイプ

UIValue<"border" | ({} & string) | Color | "amber.50" | "amber.100" | "amber.200" | "amber.300" | "amber.400" | "amber.500" | "amber.600" | "amber.700" | "amber.800" | "amber.900" | ... 318 more ... | "yellow.950">

タイプ

DotProps

タイプ

Partial<LineProps>

タイプ

DotProps

DotProps

GitHubでこのページを編集する

前Calendar 次AreaChart