본문 바로가기

d3.js2

2. Dynamic web project: 차트 테스트 당초 Jsffidle로 차트에 대한 테스트를 진행하려고 했으나 해당 예제가 tsv파일로 이루어져 여러분에게 어려움을 야기할 수 있다는 판단이 들어 Eclipse의 dynamic web project를 이용해 진행해보도록 하겠습니다. Dynamic web project는 동적인 웹페이지를 웹어플리케이션 개발시 사용하는 프로젝트이며 JSP/Servelt을 사용하는 웹 개발 방법입니다. 먼저 이클립스에서 File > New > Dynamic Web Project를 클릭하여 project name을 입력한 후 finish를 하여 프로젝트를 만듭니다. 그리고 구조와 같이 webcontent 안에 html 파일을 만들고 d3.js example에서 가져온 html 파일을 넣은 후 저장합니다. 그리고 data파일 역.. 2019. 8. 16.
1. 차트 선택 : d3.js 개발환경구축이 잘 되셨나요? 여러 분은 이제 차트를 그리기 위한 오픈소스에 대해 살펴볼 예정입니다. 실무에서 사용하는 차트는 굉장히 많습니다. 무료 오픈소스부터 부분 유료 오픈소스등 다양한 오픈소스(highchart.js, plotly.js, d3.js 등)를 이용합니다. 이번 코멘토 과정에서는 d3.js를 이용할 생각입니다. d3.js는 차트를 동적으로 이용하게 하는 svg 이미지를 기본으로 다루는 오픈소스 차트입니다. 그리고, 다양한 예시들을 제공하고 있습니다. 그러한 예시에서 여러분 스스로 차트를 선택해보길 바랍니다. Example은 메인페이지의 좌측 상단에서 찾을 수 있습니다. 지금 쯤이면 다양한 예제를 보고 계시겠죠? 이 중 Bar chart with tooltips를 가지고 설명해보겠습니다. .. 2019. 8. 16.