shadcn-vue/apps/www/src/content/docs/charts/line.md

title	description	source	label
Line	An line chart visually displays data points connected by straight lines, illustrating trends or relationships over a continuous axis.	apps/www/src/lib/registry/default/ui/chart-line	Alpha

Installation

Only works with Vue >3.3

Run the following command

npx shadcn-vue@latest add chart-line

Setup

Follow the guide to complete the setup.

API

Example

Sparkline

We can turn the chart into sparkline chart by hiding axis, gridline and legends.

Custom Tooltip

If you want to render custom tooltip, you can easily pass in a custom component. Refer to prop definition here.