D3.js Visualization

Vzory pro tvorbu grafů D3.js: škály, datové spoje, tooltips, responzivní změna velikosti, přístupnost.

od AutumnsGrove · AutumnsGrove/ClaudeSkills

Otestováno · Funguje ★ 8.4/10

D3.js Visualization — Vzory pro tvorbu grafů D3.js: škály, datové spoje, tooltips, responzivní změna velikosti, přístupnost.

Co umí

Poskytuje vzory pracovního postupu D3.js pro tvorbu interaktivních, responzivních grafů a dashboardů – konvence okrajů, nastavení škál/os, tooltips, přechody, debounced resize a checklist přístupnosti. Spouští se při požadavcích na vlastní D3 grafy, dashboardy, síťové grafy nebo vizualizace geografických/časových řad; správně přenechává Chart.js/matplotlib pro jednoduché nebo statické grafy.

Testovací report

Dovedností řízený graf přidal debounced 250ms handler pro změnu velikosti, responzivní škálování založené na viewBox a checklist přístupnosti/barevných palet – detaily, které volná D3 odpověď přeskočila; základy D3 jsou již v baseline solidní, takže mezera je reálná, ale ne propastná.

Testováno: 2026-07-14 · Claude Code 2.x (agent harness)

Instalace

git clone https://github.com/AutumnsGrove/ClaudeSkills
cd ClaudeSkills
mkdir -p ~/.claude/skills
cp -r d3js-visualization ~/.claude/skills/d3js-visualization

Příkazy a ukázkové prompty

  • /d3js-visualizationVzory pro tvorbu grafů D3.js: škály, datové spoje, tooltips, responzivní změna velikosti, přístupnost.

Skilly se spouštějí běžnými požadavky — žádné příkazy k zapamatování. Po instalaci ho aktivují prompty jako tyto (anglicky):

  • Build a responsive D3 bar chart with hover tooltips
  • Add window-resize handling to my D3 line chart
  • Make this D3 dashboard accessible for colorblind users