chartjs-1-basic-line-chart
Sub-skill of chartjs: 1. Basic Line Chart (+2).
Best use case
chartjs-1-basic-line-chart is best used when you need a repeatable AI agent workflow instead of a one-off prompt.
Sub-skill of chartjs: 1. Basic Line Chart (+2).
Teams using chartjs-1-basic-line-chart should expect a more consistent output, faster repeated execution, less prompt rewriting.
When to use this skill
- You want a reusable workflow that can be run more than once with consistent structure.
When not to use this skill
- You only need a quick one-off answer and do not need a reusable workflow.
- You cannot install or maintain the underlying files, dependencies, or repository context.
Installation
Claude Code / Cursor / Codex
Manual Installation
- Download SKILL.md from GitHub
- Place it in
.claude/skills/1-basic-line-chart/SKILL.mdinside your project - Restart your AI agent — it will auto-discover the skill
How chartjs-1-basic-line-chart Compares
| Feature / Agent | chartjs-1-basic-line-chart | Standard Approach |
|---|---|---|
| Platform Support | Not specified | Limited / Varies |
| Context Awareness | High | Baseline |
| Installation Complexity | Unknown | N/A |
Frequently Asked Questions
What does this skill do?
Sub-skill of chartjs: 1. Basic Line Chart (+2).
Where can I find the source code?
You can find the source code on GitHub using the link provided at the top of the page.
SKILL.md Source
# 1. Basic Line Chart (+2)
## 1. Basic Line Chart
```html
<!DOCTYPE html>
<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
</head>
<body>
<canvas id="myChart" width="400" height="200"></canvas>
<script>
const ctx = document.getElementById('myChart').getContext('2d');
const myChart = new Chart(ctx, {
type: 'line',
data: {
labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun'],
datasets: [{
label: 'Sales 2024',
data: [12, 19, 3, 5, 2, 3],
borderColor: 'rgb(75, 192, 192)',
backgroundColor: 'rgba(75, 192, 192, 0.2)',
tension: 0.1
}]
},
options: {
responsive: true,
plugins: {
title: {
display: true,
text: 'Monthly Sales'
}
}
}
});
</script>
</body>
</html>
```
## 2. Bar Chart
```javascript
const ctx = document.getElementById('barChart').getContext('2d');
const barChart = new Chart(ctx, {
type: 'bar',
data: {
labels: ['Red', 'Blue', 'Yellow', 'Green', 'Purple', 'Orange'],
datasets: [{
label: 'Votes',
data: [12, 19, 3, 5, 2, 3],
backgroundColor: [
'rgba(255, 99, 132, 0.6)',
'rgba(54, 162, 235, 0.6)',
'rgba(255, 206, 86, 0.6)',
'rgba(75, 192, 192, 0.6)',
'rgba(153, 102, 255, 0.6)',
'rgba(255, 159, 64, 0.6)'
],
borderColor: [
'rgba(255, 99, 132, 1)',
'rgba(54, 162, 235, 1)',
'rgba(255, 206, 86, 1)',
'rgba(75, 192, 192, 1)',
'rgba(153, 102, 255, 1)',
'rgba(255, 159, 64, 1)'
],
borderWidth: 1
}]
},
options: {
responsive: true,
scales: {
y: {
beginAtZero: true
}
}
}
});
```
## 3. Pie/Doughnut Chart
```javascript
const ctx = document.getElementById('pieChart').getContext('2d');
const pieChart = new Chart(ctx, {
type: 'pie', // or 'doughnut'
data: {
labels: ['Desktop', 'Mobile', 'Tablet'],
datasets: [{
label: 'Device Usage',
data: [55, 35, 10],
backgroundColor: [
'rgb(255, 99, 132)',
'rgb(54, 162, 235)',
'rgb(255, 205, 86)'
],
hoverOffset: 4
}]
},
options: {
responsive: true,
plugins: {
legend: {
position: 'top',
},
title: {
display: true,
text: 'Device Usage Statistics'
}
}
}
});
```Related Skills
teams-meeting-pipeline
Operate the Teams meeting summary pipeline via Hermes CLI — summarize meetings, inspect pipeline status, replay jobs, manage Microsoft Graph subscriptions.
solidworks-to-blender-pipeline
Use when converting SolidWorks .sldprt/.sldasm geometry to Blender for rendering, animation, or visualization, including questions about STEP export settings, FreeCAD as a bridge, or which mesh format (STL/OBJ/GLTF) to choose.
portable-config-baseline-pattern
Extract machine-agnostic settings into portable template files while keeping machine-specific hooks and plugins separate
portable-baseline-pattern-implementation
Implement portable configuration baselines by separating machine-agnostic settings from machine-specific hooks and plugins
portable-baseline-pattern-extraction
Extract and separate portable baseline config from machine-specific overrides in multi-environment projects
portable-baseline-configuration-pattern
Separate portable/universal config from machine-specific settings to enable safe template reuse across environments
portable-baseline-config-pattern
Separate machine-portable baseline config from environment-specific hooks and plugins
multi-role-agent-contract-review-pipeline
Execute a 4-role agent team (Planner/Architect/Reviewer/Integrator) pipeline for self-reviewing knowledge artifacts before delivery
batch-syntax-fix-with-regex-line-based-fallback
Fix repeated syntax errors across many files using regex, then fall back to line-based parsing when regex fails
exclude-wiki-Codex-md-from-harness-line-limit-hook
Fix false-positive pre-commit failures where workspace-hub's AGENTS.md line-limit hook blocks edits to auto-generated wiki schema files under knowledge/wikis/.
gtm-prospect-pipeline-phased-execution
Phased execution pattern for
artifact-inline-plan-review-for-local-draft-revisions
Prevent false MAJOR plan-review findings when Codex/Gemini review stale remote/main artifacts instead of the revised local draft.