꿈꾸는 개발자의 블로그
[React] Chart.js로 Doughnut(도넛) 차트 그리기 본문
React에서 데이터를 시각화할 때 Chartjs 라이브러리를 사용해보았다. 이 때, 참고하기 좋은 사이트 2개를 올려본다. 도넛 차트 외에도 다양한 모양의 차트를 볼 수 있다. 특히, 아래 2번째 사이트에서는 어떻게 사용하면 좋을지 Example이 친절하게 나와있으니, 코드를 그대로 복붙하여 금방 눈으로 확인할 수 있을 것이다!!
728x90
라이브러리 설치
yarn add react-chartjs-2 chart.js
참고 사이트
https://www.chartjs.org/docs/latest/samples/other-charts/doughnut.html
Doughnut | Chart.js
Last Updated: 2/12/2022, 2:48:34 PM
www.chartjs.org
https://react-chartjs-2.js.org/examples/doughnut-chart/
Doughnut Chart | react-chartjs-2
Example of doughnut chart in react-chartjs-2.
react-chartjs-2.js.org
결과 화면
728x90
728x90
'Programming > React' 카테고리의 다른 글
| [React] styled-components props 값 넘겨 받기 (0) | 2022.06.16 |
|---|---|
| [React] styled-components 사용하기 (0) | 2022.06.14 |
| [React] .env 파일 환경변수 설정하기 (0) | 2022.05.22 |
| [React] AWS S3 이미지 파일 업로드 하기 (0) | 2022.05.22 |
| [React] AWS S3 이미지 파일 업로드 하기 : AWS S3 버킷 생성 (0) | 2022.05.19 |
'Programming/React' Related Articles
more
Comments