React - 도넛 애니메이션 차트 만들기(with conic-gradient)
[개요]
반시계 방향으로 도넛차트가 줄어드는 함수 구현하기
[방법]
conic-gradient라는 css 속성을 활용
setInterval( ) 함수로 일정시간 동안 타이머처럼 원의 영역이 줄어들도록 구현함
1. conic-gradient
https://developer.mozilla.org/en-US/docs/Web/CSS/gradient/conic-gradient
conic-gradient() - CSS: Cascading Style Sheets | MDN
The conic-gradient() CSS function creates an image consisting of a gradient with color transitions rotated around a center point (rather than radiating from the center). Example conic gradients include pie charts and color wheels. The result of the conic-g
developer.mozilla.org
The conic-gradient() CSS function creates an image consisting of a gradient with color transitions rotated around a center point (rather than radiating from the center). Example conic gradients include pie charts and color wheels. The result of the conic-gradient() function is an object of the <grad...
developer.mozilla.org
