svg curved chart
-
SVG 왕초보와 함께하는 그래프/차트 만들기 - 2. 직선, 곡선 그래프토막글 2021. 8. 2. 13:38
안녕하세요 :) 이번엔 SVG로 곡선 그래프를 만들어본 경험을 공유해보려 합니다. 앞서 SVG 왕초보와 함께하는 그래프/차트 만들기 - 1. 도넛 차트 를 읽고 오신 분이 아니라면, 해당 글에서 설명했던 내용들이 비슷하게 다시 나오기 때문에 도넛 차트를 구현하실 분이 아니더라도 읽고 와주시면 더 이해가 빠를거예요! 다만 d attribute의 A command는 안 쓸거니 스킵하셔도 됩니다. (해당 글 2번 섹션에 있음) 이번에도 결과부터 보자면, 왼쪽의 데이터가 오른쪽 차트로 보이게 됩니다. 구현 순서 구현 순서를 요약해 말해보자면 다음과 같습니다. 요번엔 3번이 고비예요 데이터를 그래프 좌표로 변환하기 직선 그래프 그려보기 곡선 그래프를 위한 control point 만들기 (control point..