27 lines
767 B
TypeScript
27 lines
767 B
TypeScript
"use client";
|
|
|
|
interface SparklineProps {
|
|
data: number[];
|
|
width?: number;
|
|
height?: number;
|
|
color?: string;
|
|
}
|
|
|
|
export function Sparkline({ data, width = 80, height = 24, color = "#3b82f6" }: SparklineProps) {
|
|
if (!data || data.length < 2) return null;
|
|
const min = Math.min(...data);
|
|
const max = Math.max(...data);
|
|
const range = max - min || 1;
|
|
const points = data.map((v, i) => {
|
|
const x = (i / (data.length - 1)) * width;
|
|
const y = height - ((v - min) / range) * (height - 4) - 2;
|
|
return `${x},${y}`;
|
|
}).join(" ");
|
|
|
|
return (
|
|
<svg width={width} height={height} className="inline-block">
|
|
<polyline points={points} fill="none" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
|
|
</svg>
|
|
);
|
|
}
|