File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
File name
Commit message
Commit date
import React, { useEffect, useRef } from "react";
import { Chart } from "chart.js/auto";
const AllBarChart = ({ labels, datasets }) => {
const chartRef = useRef(null);
useEffect(() => {
const ctx = chartRef.current.getContext("2d");
const chartInstance = new Chart(ctx, {
type: "bar",
data: {
labels: labels,
datasets: datasets,
},
options: {
responsive: true,
plugins: {
legend: {
position: "top",
},
},
scales: {
x: {
title: {
display: true,
text: "날짜",
},
ticks: {
font: {
family: "JalnanGothic, sans-serif",
},
},
},
y: {
title: {
display: true,
text: "점수",
},
ticks: {
font: {
family: "JalnanGothic, sans-serif",
},
},
},
},
},
});
return () => {
chartInstance.destroy();
};
}, [labels, datasets]);
return <canvas ref={chartRef} />;
};
export default AllBarChart;