D3.js 데이터 업데이트, 선택자, 레이어구조의 중요성

D3.js 라이브러리를 쓰면 쓸수록 데이터 업데이트, 선택자, 레이어구조를 잡는것의 중요성에 대해 깨달아가고 있다.

특히 최근에는 collapse 기능이 들어간 tree diagram을 만들기회가 있었는데,

위 3가지를 능숙하게 다루어야 만들 수 있었다.

먼저 이벤트에 따라 데이터를 업데이트 하고 그에따라 enter, exit 선택자 함수를 이용하여 enter, update, exit의 함수를 설계한다.

그리고 노드와 링크의 레이어 구조를 잡아서 화면에 나타내 준다.

말로 설명해서 간단하지만 직접 처음부터 만들어야 하는 사람이 생각한다면

3가지에 대한 제대로된 이해없이는 설계자체가 불가능하다.

D3.js를 처음하는 분이라면 어느정도 함수를 공부하고

조금 난이도 있는 시각화 결과물을 위의 3가지 관점에서 분석해 보는것을 추천한다.