๐Ÿ‘จ‍๐Ÿ’ป kimtongting
article thumbnail
[React] chartjs / chart.js / react ์ฐจํŠธ / react chart

Chart.js ์ด๋ฒˆ์— ์‹ ๊ทœ ํ”„๋กœ์ ํŠธ๋ฅผ ์ง„ํ–‰ํ•˜๊ฒŒ๋˜์–ด ์‹œ์•ˆ์„ ๋ฐ›์•˜๋‹ค. ๋งค์ถœ์ด๋‚˜ ํ˜„ํ™ฉ ๋“ฑ ์ฃผ๋กœ ๋Œ€์‹œ๋ณด๋“œ์—์„œ ์ž์ฃผ ์“ฐ์ด๋Š” ์ฐจํŠธ๋ฅผ ์‚ฌ์šฉ ํ•ด๋ณด๋ ค๊ณ  ํ•œ๋‹ค. ์•„! ์—ฌ๊ธฐ์—์„œ๋Š” ํ•จ์ˆ˜ํ˜• ์ปดํฌ๋„ŒํŠธ๋ฅผ ์‚ฌ์šฉํ•˜๊ณ  ์žˆ๋‹ค : ) Install $ npm install chart.js --save Import import Chart from 'chart.js/auto'; How to Use function ??? () { const canvasDom = useRef(null); // Dependency array ์— props ์ถ”๊ฐ€ํ•˜๊ณ  return์— chart.destory() ์ถ”๊ฐ€ ์˜ˆ์ • useEffect(() => { const ctx = canvasDom.current.getContext("2d"); new Chart(ctx, {..