[웹사이트 개발일지] 차트 구현의 장벽, 응용력이 문제

단순해 보이는 문제도 비틀면 어려워진다. 지금 그렇다. chart.js라는 차트 구현 라이브러리 사용을 시도하고 있는데 맘처럼 되지 않는다. 처음 사용해보는 라이브러리다 보니 예시를 보면서 따라 하고 있는데 예시의 경우 확정된 정보를 코딩하는 방식으로 간단하게 나와 있다. 만약 이와 비슷하게 사용한다면 그냥 같은 틀에서 데이터만 바꿔주면 될 것이다. 

 

chart.js 도넛차트 샘플

그러나 나의 경우 검색 결과에 따라 값을 받아오고, 그 값을 변수의 형태로 넣어줘야 한다. for문을 어떻게 사용할 것인가에 대한 문제를 해결해야 하는 거 같다. 쉽사리 풀리지 않는다. 될듯 말듯 하면서도 안되고 이써 힘이 빠지는 동시에 역량에 대한 한계도 느껴진다. for문 배웠는데 이 정도도 못써먹니..?

 

이번처럼 문제 해결 방법에 대한 대략적인 아이디어는 머리에 있는데 잘 되지 않을때 계속 스스로 고민을 하는 게 맞는 건지, 검색하면서 최대한 나와 가까운 사례를 찾는 게 맞는 건지. 어느 편이 더 빠른지. 잘 모르겠다.


알게 된 것

  • chart.js, canvasJS 등 라이브러리가 동적 차트 구현을 지원함
  • 파이 차트 외에도 도넛 차트가 있음

모르는 것

  • 상황에 따라 달라지는 배열 형태의 데이터를 정해진 틀에 집어넣기(반복문, 변수 등)

해결할 문제

  • 최대주주 현황 도넛 차트 구현

웹페이지 만들기 깃허브 링크(포스팅 시점)

프로젝트 결과물 | 느낀점

반응형

댓글

Designed by JB FACTORY