들어가며

머리말과 저자목록

Notion 링크, PDF 파일 및 QR 코드

Notion 링크

PDF 파일 및 QR 코드

1장 데이터 시각화란?

1.1 데이터 시각화, 왜 중요할까?

1.2 데이터 시각화의 긍정적인 사례

1.2.1 첫 번째 사례: 뉴욕 타임즈 'How the Virus Got Out' 기사

1.2.2 두 번째 사례: FiveThirtyEight의 선거 예측

1.2.3 세 번째 사례: Flightradar24

1.3 FE 개발자에게 데이터 시각화 지식이 필요한 이유

1.4 데이터 시각화에서 FE 개발자가 고려해야 할 점

1.4.1 반응형

1.4.2 접근성

1.4.3 직관성

1.5 이 책의 목적과 구성

2장 데이터 시각화 기초

2.1 데이터 시각화의 기본 개념

2.1.1 데이터, 정보, 지식의 관계

2.1.2 데이터 시각화의 목적

2.1.3 게슈탈트 원리와 데이터 시각화

1. 가까운 것끼리 묶자 (근접성)
2. 비슷한 것끼리 묶자 (유사성)
3. 닫힌 것을 하나로 묶자 (폐쇄성)
4. 나열된 요소를 하나로 묶자 (연속성)

2.1.4 색상 이론과 시각화에서의 적용

1. 색상 조화
2. 색상의 의미
3. 색각 이상자를 위한 고려

2.1.5 데이터 인코딩: 시각적 변수

1. 위치
2. 길이
3. 각도
4. 면적
5. 부피
6. 색상
7. 질감

2.2 데이터 시각화 유형

2.2.1 막대 차트

2.2.2 선 그래프

2.2.3 파이 차트

2.2.4 산점도

2.2.5 버블 차트

2.2.6 히트맵

2.2.7 지도: 단계구분도, 버블맵, 히트맵

1. 단계구분도
2. 버블맵
3. 지도 히트맵

3장 사용 라이브러리 소개

3.1 데이터 시각화 라이브러리 소개

3.1.1 Chart.js

1. 특징
2. Chart.js는 언제 사용하는게 좋을까?

3.1.2 D3.js

1. 특징
2. D3.js는 언제 사용하는게 좋을까?

3.1.3 Leaflet

1. 특징
2. Leaflet은 언제 사용하는게 좋을까?

3.1.4 Canvas

1. 특징
2. Canvas는 언제 사용하는게 좋을까?

3.2 프로젝트 폴더 구조

4장 Chart.js를 사용한 데이터 시각화

4.1 소개

4.2 차트 사용법