簡介
適用於 React 應用程式的精美現代 UI 元件。
Bklit UI 是一個基於 shadcn/ui 打造的元件庫，協助您更輕鬆地建構圖表與資料視覺化。
使用方式
面積圖採用與折線圖相同的可組合 API。請參閱圖表畫廊以查看互動範例。
jsx
import { AreaChart, Area, Grid, XAxis, ChartTooltip } from "@bklitui/ui/charts";
const data = [
{ date: new Date("2025-01-01"), revenue: 12000, costs: 8500 },
{ date: new Date("2025-01-02"), revenue: 13500, costs: 9200 },
// ... more data
];
export default function RevenueChart() {
return (
<AreaChart data={data}>
<Grid horizontal />
<Area dataKey="revenue" fill="var(--chart-line-primary)" />
<Area dataKey="costs" fill="var(--chart-line-secondary)" />
<XAxis />
<ChartTooltip />
</AreaChart>
);
}