React.js에서 그래프를 그려보고 싶었기 때문에 recharts를 시도했습니다.

안녕하세요, 히로입니다!
이번에는 우연히 github 트렌드를 바라보고 있으면 재미있을 것 같은 라이브러리가 있었기 때문에 React.js에서 그래프를 그려보고 싶다고 생각했는데 우연히 좋은 것 같은 라이브러리를 발견했기 때문에 시도했습니다!

recharts
h tp : // Recha rts. rg/
github
htps : // 기주 b. 코 m / Recha rts / Recha rts

React + D3로 그래프를 그리기 위한 라이브러리입니다. API document를 참고로 구현하면 어색하게 구현할 수 있을 것 같은 생각이 들었으므로, documet의 example code를 모사하면서, 샘플을 만들어 보았습니다.

이번에 만든 것은 이쪽
샘플 페이지
h tps : // 레아 ct-레 rts-씨 d보 x. 흠뻑 빠지다 p. 코m/
github
htps : // 기주 b. 코 m / 타카 히로 - 에키 / 레아 ct - rts-san dbo x

샘플 이미지 1


샘플 이미지 2

시도한 소감

지금까지 데이터 비주얼라이제이션에 관심은 있었던 것의, 중연이 없고 만지는 일이 없었습니다만, 요즘 주목받고 있는 빅 데이터이거나, 이쪽의 키타의 기사에 있는 것 같은 - 일본의 행정기관이 공개 중인 API에 대한 정리(2016년 8월 17일 잠정판) - 행정기관의 데이터를 사용하여 무언가를 만들려고 하면 시각적으로 표현할 수 있는 것이 UX적으로도 좋다고 생각합니다. 이를 위해서도 D3.js이거나, 데이터 비주얼라이제이션에 특화된 라이브러리를 알고, 취급할 수 있도록 해 두는 것은 득책이라고 생각합니다.

나는 평소 React.js를 선호하고 사용하기 때문에 recharts와 같은 라이브러리가 있으면 매우 도움이됩니다. 실제로, 실장(모사)해 보고, 뭔가의 기회에 사용해 보고 싶은 재차 생각했습니다.

만약 만져보고 싶다고, 시험해보고 싶다고 생각하는 분이 있으면 이쪽의 example의 code를 봐 두면 좋다고 생각합니다.
h tp : // Recha rts. 오 rg / えぁ mpぇs

간단한 내용이지만, 이상입니다!