Code
<script lang="ts">
import { Chart } from 'sv5ui-plus';
const data = {
labels: ['Jan', 'Feb', 'Mar'],
datasets: [{ label: 'Sales', data: [10, 20, 30] }]
};
</script>
<div class="h-64 w-full">
<Chart type="bar" {data} />
</div>
Chart
A beautiful, fully interactive charting wrapper built on top of ApexCharts. Extremely flexible to cover any data visualization use case you need.
Bar Chart
Simple comparisons with rounded corners.
Area Chart
Smooth curves with beautiful gradients for trends.
Stacked Column Chart
Perfect for visualizing composition and parts-to-whole over time.
Mixed Chart (Line + Column)
Combine different types to compare multiple metrics (e.g. Revenue vs Margin).
Donut Chart
Clear proportional breakdown with hover expansions.
Radar Chart
Analyze multiple variables simultaneously.
Radial Bar Gauge
Ideal for scorecards and KPI dashboard indicators.