[빅데이터] D3.js 로 가능한 것들 - 데이터 시각화 오픈소스

D3.js는 무엇인가?

 

데이터 분석과 시각화가 주목을 받으면서 관련된 언어선택의 이슈에 맞닿게 됩니다. 자신에게 맞는 언어를 찾아 숙련도를 높여야 하는거죠. 그러기 위해서는 각 언어에 대해 알아야 합니다. 그래서 이번에는 시각화의 대표적 언어라 할 수 있는 D3.js 를 소개합니다. 오픈소스이기 때문에 구하기도 쉽고 마찬가지로 라이브러리도 많기에 시각화를 처음 접하는 분들이 쓰기 좋은 언어입니다.

---

D3 라는 이름은 Data Driven Document 의 축약형이다. D3.js 는 오픈소스 JavaScript 라이브러리로, 빅데이터를 보여주는 문서를 조작할 수 있다. 이 프로그램 집합을 사용하면 웹 기술(HTML5, SVG, SCC) 을 이용하여 동적인 그래픽을 만들 수 있다. 또한, 여러가지 시각화 방법을 제공하여 코드 다이어그램이나 거품형 차트, 계통도, 트리 등의 그림을 만들 수 있다. D3.js 는 오픈소스이기 때문에 끊임없이 개선되고 확장되고 있으며, 속도가 빠르고 다양한 플랫폼에서 실행되는 프로그램과 호환되도록 설계되었다. 완벽한 데이터 시각화 프로그램(Tebleau)을 대체할 정도는 아니지만, 좋은 부가 구성요소임을 기억해두자. D3.js 는 뉴욕 타임즈의 그래픽 편집자인 마이클 보스톡(Michael Bostock) 이 개발하였다. 

---

 

위 내용에 나타난 것처럼 D3.js 는 시각화 전문 프로그램은 아니나, 전문 프로그램에 준하는 효과를 낼 수 있는 오픈소스 라이브러리로 볼 수 있습니다. 개인이 사용하기에는 오히려 적합할 수 있습니다. 라이센스 비용이 들지 않고 R 처럼 오픈소스이기 때문에 빠른 속도로 개선되고 확장되고 있기 때문입니다.

 

홈페이지 : http://d3js.org/

 

홈페이지의 소개에 따르면 앞선 설명처럼 데이터 문서를 제작하기 위한 자바스크립트 라이브러리라고 되어있는 것을 볼 수 있습니다. 아래는 그 문구입니다.

 

---

D3.js is a JavaScript library for manipulating documents based on data. D3 helps you bring data to life using HTML, SVG, and CSS. D3’s emphasis on web standards gives you the full capabilities of modern browsers without tying yourself to a proprietary framework, combining powerful visualization components and a data-driven approach to DOM manipulation. 

---

 

D3.js API Reference 

● 페이지 : https://github.com/mbostock/d3/wiki/API-Reference

 

 

컨셉 소개 

● 페이지 : https://github.com/mbostock/d3/wiki/Tutorialsiki/Tutorials

 

 

D3.js 관련 강의

● 페이지 : https://www.udacity.com/course/data-visualization-and-d3js--ud507

● 페이지 : http://journalismcourses.org/D3.html

 

 

D3.js 관련 영상

● 페이지 : https://www.youtube.com/watch?v=8jvoTV54nXw

● 페이지 : http://blog.visual.ly/visual-ly-meetup-recap-introductory-d3-workshop/

 

 

D3.js  라이브러리 시각화의 예시

● 페이지 : https://github.com/mbostock/d3/wiki/Gallery