[D3.js] 동작방식

Data-Driven-Documents.js

 

1. Loading (데이터 불러오기)

: 시각적 요소를 그리기 전에 보여주고자 하는 데이터를 불러온다.

.tsv, .csv, json 등 다양한 형식의 데이터 연동 가능.

 

2. Binding (데이터 엮기)

: 데이터를 시각적인 요소와 연동시킨다.

시각적 요소 안에 데이터 수치를 입력한 코드에 맞춰 연동시킨다.

 

3. Transform (시각적 요소 지정)

: 데이터의 시각적인 요소 지정

그래프의 유형, 요소의 색상, 축과 범례의 여부 등 다양한 요소 지정 가능

파이, 트리맵 등 그래프 유형별로 레이아웃 코드 제공

 

4. Transition (사용자 반응 지정)

: 클릭, 드래그 등 사용자 반응에 따른 효과 지정 가능