web-data-visualization
Installation
SKILL.md
Web Data Visualization Skill
web/_design/data.json을 입력으로 받아 인터랙티브 차트를 web/scripts/에 구현하는 워크플로우.
워크플로우
Step 1: 라이브러리 선택 (CDN 사용)
| 차트 유형 | 권장 라이브러리 | CDN |
|---|---|---|
| 라인/바/도넛/콤보 | Chart.js v4 | cdn.jsdelivr.net/npm/chart.js@4 |
| 히트맵·sankey·복잡 인터랙션 | Apache ECharts v5 | cdn.jsdelivr.net/npm/echarts@5 |
| 커스텀 fan chart·복합 SVG | D3.js v7 (필요 시만) | d3js.org/d3.v7.min.js |
| 보조: 트윈 애니메이션 | GSAP (motion-designer가 사용 중이면 공유) | - |
원칙: 단일 사이트에 라이브러리 1~2개만. 표준 차트는 Chart.js, 특수 차트(매트릭스·sankey)는 ECharts.