- Svelte와 D3를 사용하여 인터랙티브한 데이터 시각화를 브라우저 내에서 설정 없이 구축하는 방법을 배웁니다. 💻
- 데이터 시각화는 다양한 컴퓨터 과학 분야를 접할 수 있는 다학제적 기술입니다. 🧮
- Svelte Playground를 통해 브라우저에서 바로 간단한 산점도를 만들고, 스케일, 상호 작용, 애니메이션을 다룹니다. 🎨
- 데이터 시각화의 기본 요소는 캔버스, 축, 레이블, 그리고 데이터입니다. 📊
- SVG를 사용하여 캔버스를 만들고, 그룹 태그를 사용하여 요소들을 묶어 위치를 조정합니다. 📦
- 반응형 디자인을 위해 div의 너비를 chart width에 바인딩하고, derived를 사용하여 반응성을 유지합니다. ↔️
- 축은 단순히 선이며, x1, y1, x2, y2 속성을 사용하여 위치를 조정할 수 있습니다. 📏