# Chartjs

> Create simple, responsive charts quickly with Chart.js using canvas-based rendering

- Skill: `vamseeachanta/chartjs` (Agent Skill)
- Install (CLI): `npx skillmds@latest add vamseeachanta/chartjs`
- Raw SKILL.md: https://api.skillmd.com/api/skills/vamseeachanta/chartjs/raw
- Safety review: PASS (external: skill-scanner PASS, skillspector PASS)
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Coding & Dev Tools
- Author: vamseeachanta (https://skillmd.com/u/vamseeachanta)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/vamseeachanta/chartjs

---


# Chartjs

## When to Use This Skill

Use Chart.js when you need:
- **Quick implementation** - Up and running in minutes
- **Simple charts** - Line, bar, pie, doughnut, radar charts
- **Minimal configuration** - Sensible defaults that work out of the box
- **Small projects** - Lightweight library (60KB gzipped)
- **Responsive charts** - Mobile-friendly by default
- **No dependencies** - Standalone library

**Avoid when:**
- Complex customization needed (use D3.js)
- 3D charts required (use Plotly)
- Advanced scientific visualizations needed (use Plotly)
- Large datasets >10k points (use Plotly with WebGL)

## Resources

- **Official Docs**: https://www.chartjs.org/docs/latest/
- **Samples**: https://www.chartjs.org/docs/latest/samples/
- **GitHub**: https://github.com/chartjs/Chart.js
- **Community**: https://github.com/chartjs/awesome

## Sub-Skills

- [1. Basic Line Chart (+2)](1-basic-line-chart/SKILL.md)
- [1. Use Responsive Containers (+3)](1-use-responsive-containers/SKILL.md)
- [With React (+1)](with-react/SKILL.md)

## Sub-Skills

- [Example 1: Multi-Dataset Line Chart (+5)](example-1-multi-dataset-line-chart/SKILL.md)
- [Available Chart Types](available-chart-types/SKILL.md)
- [Custom Colors (+2)](custom-colors/SKILL.md)
- [CDN (Quick Start) (+2)](cdn-quick-start/SKILL.md)
- [Chart.js Zoom Plugin (+2)](chartjs-zoom-plugin/SKILL.md)
- [Performance Tips](performance-tips/SKILL.md)