# @VictoryJS

restarea

본 시리즈는 프론트엔드 엔지니어로서 데이터 시각화에 대한 실용적이고 실무적인 내용을 다룬 글로 개인 경험을 토대로 작성되어 다소 주관적인 내용을 내포하고 있습니다. !codesandbox[2-chart-examples-pm1l8o?fontsize=14&hidenavigation=1&theme=dark] 기본 개념 바 차트 (Bar chart) 바 차트는 여러 항목이 존재할 때 그 수량을 한 눈에 비교하는데 특화되어있습니다. 사람은 높이 차이에 민감해 최고 최저에 대한 강조함에 있어 적합합니다. 라인 차트 (Line chart) 데이터의 변화를 직관적으로 파악하는데 강점이 있는 차트입니다. 최대, 최소보다는 증가, 감소에 초점이 맞춰져있습니다. 보편적으로 x축에는 시간과 관련된 dimension들이 들어가게됩니다. 파이 차트 (Pie chart) 비례 관계를 표현하는데 적합합니다. 공간이 한정적인만큼 사용에 주의가 필요합니다. 흔히 6가지 이상의

yhnb3

개인 프로젝트하기 개인 프로젝트를 해야합니다. 주제 자유.. 창의성이라고 1도 없는 저에게 자유 주제는 너무 가혹한 처사가 아닐 수 없습니다. 그래서! 저번에 살짝 하려고 시작했던 갤럭시 날씨앱 클론 코딩을 해보려고 합니다. 이것참 클론 코딩이라는게 뭔가 남의 것을 날름 뺏어 베끼는 것 같아서 조금 걸리긴 하지만 그래도 뭔가 새로운 것을 기획하기에는 시간이 많이 모자라다고 생각하기에 그냥 진행 하기로 하였습니다. 진행 사항 현재 날씨 일주일 날씨 시간별 날씨정도 간단하게 요정도 구현되었으며 각 각의 카테고리에서 좀더 심도화 하여서 더 보기 좋게 만들 예정입니다. 오늘 구현 한것 오늘은 시간별 날씨 컴포넌트에 Victory js를 이용해서 그래프를 추가하였습니다. 깨달은 부분 victory chart에 padding을 설정할 수가 있다는 점. victory line chart와 victory scatter chart를 함께

kgorae

javascript 숫자 천 단위 콤마 표시 >Number.toLocaleString() 참고 - MDN Number.prototype.toLocaleString() Tips switch문 / if문 대체 코드 Victory.js 라인 그래프에 툴팁 쓰려면 VictoryGroup VictoryGroup

kgorae

Javascript Victory.js 공식 사이트 참고 블로그 차트 생성을 도와주는 라이브러리 svg 여백 처리가 깔끔해서 디자인 요구사항 대응에 탁월하다 D3js 보다 쓰기 쉽다, 문서화가 아주 잘 돼있다 bignumber.js https://github.com/MikeMcl/bignumber.js 큰 수 연산 라이브러리 js 수 연산의 부정확성 [참고 블로그](https://joooing.tistory.com/e