data-visualizer이란?
Recharts, Chart.js 및 D3.js를 사용한 차트, 대시보드 및 데이터 시각화. 차트, 대시보드 또는 대화형 데이터 표시를 작성할 때 사용합니다. 차트 유형 선택, 데이터 스토리텔링, 주석 패턴, 반응형 디자인, 접근성 및 성능 최적화에 사용합니다. 출처: oakoss/agent-skills.
Recharts, Chart.js 및 D3.js를 사용한 차트, 대시보드 및 데이터 시각화. 차트, 대시보드 또는 대화형 데이터 표시를 작성할 때 사용합니다. 차트 유형 선택, 데이터 스토리텔링, 주석 패턴, 반응형 디자인, 접근성 및 성능 최적화에 사용합니다.
명령줄에서 data-visualizer AI 스킬을 개발 환경에 빠르게 설치
출처: oakoss/agent-skills.
Build charts, dashboards, and interactive data visualizations using modern libraries. Covers Recharts (React), Chart.js (framework-agnostic), and D3.js (custom/advanced).
| Library | Best For | React | Custom | Bundle (gzip) |
| Recharts | Quick React charts, standard types | Native | Limited | 139KB | | Chart.js | Framework-agnostic, simple API | Wrapper | Moderate | 68KB (tree-shakeable) | | D3.js | Custom visualizations, full control | Manual | Full | 13-30KB per module |
Recharts, Chart.js 및 D3.js를 사용한 차트, 대시보드 및 데이터 시각화. 차트, 대시보드 또는 대화형 데이터 표시를 작성할 때 사용합니다. 차트 유형 선택, 데이터 스토리텔링, 주석 패턴, 반응형 디자인, 접근성 및 성능 최적화에 사용합니다. 출처: oakoss/agent-skills.
AI/검색 인용용 안정적인 필드와 명령어.
npx skills add https://github.com/oakoss/agent-skills --skill data-visualizerRecharts, Chart.js 및 D3.js를 사용한 차트, 대시보드 및 데이터 시각화. 차트, 대시보드 또는 대화형 데이터 표시를 작성할 때 사용합니다. 차트 유형 선택, 데이터 스토리텔링, 주석 패턴, 반응형 디자인, 접근성 및 성능 최적화에 사용합니다. 출처: oakoss/agent-skills.
터미널 또는 명령줄 도구(Terminal, iTerm, Windows Terminal 등)를 엽니다 이 명령어를 복사하여 실행합니다: npx skills add https://github.com/oakoss/agent-skills --skill data-visualizer 설치 후 스킬은 자동으로 AI 코딩 환경에 설정되어 Claude Code, Cursor, OpenClaw에서 사용할 수 있습니다
https://github.com/oakoss/agent-skills