D3.js Visualization
D3.js diagrambyggnadsmönster: skalor, data joins, tooltips, responsiv storleksändring, tillgänglighet.
Testad · Fungerar
Vad den gör
Tillhandahåller D3.js arbetsflödesmönster för att bygga interaktiva, responsiva diagram och dashboards – marginalkonventioner, skala/axelinställning, tooltips, övergångar, debounced resize och en tillgänglighetschecklista. Utlöses vid förfrågningar om anpassade D3-diagram, dashboards, nätverksgrafer eller geografiska/tidsserievissualiseringar; hänvisar korrekt till Chart.js/matplotlib för enkla eller statiska diagramförfrågningar.
Testrapport
Skicklighetsstyrt diagram lade till en debounced 250ms resize-hanterare, viewBox-baserad responsiv skalning och en checklista för tillgänglighet/färgblinda-palett – detaljer som ett frihands-D3-svar hoppade över; D3-grunderna är redan solida i baslinjen så skillnaden är verklig men inte natt och dag.
Testad: 2026-07-14 · Claude Code 2.x (agent harness)
Installation
git clone https://github.com/AutumnsGrove/ClaudeSkills cd ClaudeSkills mkdir -p ~/.claude/skills cp -r d3js-visualization ~/.claude/skills/d3js-visualization
Kommandon och exempelprompter
/d3js-visualizationD3.js diagrambyggnadsmönster: skalor, data joins, tooltips, responsiv storleksändring, tillgänglighet.
Skills triggas av vanliga förfrågningar — inga kommandon att memorera. Efter installationen aktiverar prompter som dessa skillen (på engelska):
Build a responsive D3 bar chart with hover tooltipsAdd window-resize handling to my D3 line chartMake this D3 dashboard accessible for colorblind users