LineChart
Responsive line chart with support for multiple lines, dots, and various line types.
Playground
Props
| Prop | Type | Default | Value |
|---|---|---|---|
xAxisKey* | string | — | |
lines* | LineConfig[] | — | — |
xAxis | AxisConfig | — | — |
yAxis | AxisConfig | — | — |
Usage
// Simple line chart
<LineChart
data={timeSeriesData}
xAxisKey="date"
lines={[{ dataKey: 'value', name: 'Sales' }]}
/>
// Multiple lines
<LineChart
data={timeSeriesData}
xAxisKey="date"
lines={[
{ dataKey: 'revenue', name: 'Revenue', type: 'monotone' },
{ dataKey: 'expenses', name: 'Expenses', type: 'monotone', strokeDasharray: '5 5' },
]}
/>