Area Chart
Visualise continuous trends and cumulative values with smooth area graphs.
Install the Area Chart component using the nocta-ui CLI:
npx @nocta-ui/cli add area-chart
Import the component:
import {
AreaChart,
AreaChartHeader,
AreaChartTitle,
AreaChartDescription,
AreaChartActions,
AreaChartGraph,
AreaChartLegend,
AreaChartDataTable,
AreaChartDataTableContent,
} from '@/components/ui/area-chart';
Examples
Default Area Chart
Compare multiple series
Data table summary
API Reference
AreaChart
AreaChartGraph
AreaChartTitle
AreaChartDescription
AreaChartActions
AreaChartLegend
AreaChartDataTable
AreaChartDataTableContent