LineChart

Sightings
Recruits

Add smooth for curves instead of straight segments. The curve still passes through every point and never overshoots it, so a smooth line cannot dip below the data or past the axis.

Sightings
Recruits

When the data changes, the lines glide to their new positions instead of redrawing (pass animate={false} for an instant update).

Props

labelsstring[]
Names of the x positions / categories.
series{ name, values: number[], color? }[]
One entry per series; values has one number per label.
heightnumber
Default: 300
Chart height in px (width follows the container).
labelstring
Accessible name for the chart.
legendboolean
Default: true
Show the legend when there are several series.
areaboolean
Default: false
Fill under each line.
smoothboolean
Default: false
Draw curves instead of straight segments. They pass through every point and never overshoot it.
animateboolean
Default: true
Animate the chart in when it appears and glide it to new values when the data changes (skipped for users who prefer reduced motion).
classNamestring
Default: ''
Extra classes for the root element.

LineChart props
Prop	Type	Default	Description
`labels`	string[]	–	Names of the x positions / categories.
`series`	{ name, values: number[], color? }[]	–	One entry per series; `values` has one number per label.
`height`	number	`300`	Chart height in px (width follows the container).
`label`	string	–	Accessible name for the chart.
`legend`	boolean	`true`	Show the legend when there are several series.
`area`	boolean	`false`	Fill under each line.
`smooth`	boolean	`false`	Draw curves instead of straight segments. They pass through every point and never overshoot it.
`animate`	boolean	`true`	Animate the chart in when it appears and glide it to new values when the data changes (skipped for users who prefer reduced motion).
`className`	string	`''`	Extra classes for the root element.