41 lines
824 B
TypeScript
41 lines
824 B
TypeScript
"use client"
|
|
import React from "react"
|
|
import {
|
|
Chart as ChartJS,
|
|
CategoryScale,
|
|
LinearScale,
|
|
BarElement,
|
|
Title,
|
|
Tooltip,
|
|
Legend,
|
|
} from "chart.js"
|
|
import { Bar } from "react-chartjs-2"
|
|
|
|
ChartJS.register(CategoryScale, LinearScale, BarElement, Title, Tooltip, Legend)
|
|
|
|
type Props = {
|
|
labels: string[]
|
|
datasets: Array<{
|
|
label?: string
|
|
data: number[]
|
|
backgroundColor?: string | string[]
|
|
}>
|
|
}
|
|
|
|
export default function BarChart({ labels, datasets }: Props) {
|
|
const data = { labels, datasets }
|
|
|
|
const options = {
|
|
responsive: true,
|
|
maintainAspectRatio: false,
|
|
plugins: { legend: { position: "top" as const } },
|
|
scales: { y: { beginAtZero: true } },
|
|
}
|
|
|
|
return (
|
|
<div style={{ width: "100%", minHeight: 260 }}>
|
|
<Bar data={data} options={options} />
|
|
</div>
|
|
)
|
|
}
|