D3 Viz
Skill StaleCreating interactive data visualisations using d3.js. This skill should be used when creating custom charts, graphs, network diagrams, geographic visualisations, or any complex SVG-based data visualisation that requires fine-grained control over visual elements, transitions, or interactions. Use this for bespoke visualisations beyond standard charting libraries, whether in React, Vue, Svelte, vanilla JavaScript, or any other environment.
To empower users to create sophisticated, custom, and interactive data visualizations using d3.js, offering fine-grained control beyond standard charting libraries.
Features
- Guidance on d3.js setup and integration patterns
- Code examples for various chart types (bar, line, scatter, chord, heatmap, etc.)
- Implementation of interactivity (tooltips, zoom, click)
- Techniques for responsive sizing and animations
- Best practices for data preparation, performance, and accessibility
Use Cases
- Creating bespoke charts and graphs beyond standard libraries
- Developing complex SVG-based visualizations with custom layouts
- Implementing interactive elements like pan, zoom, or brush behaviors
- Building network diagrams, geographic visualizations, or choreographed transitions
Non-Goals
- Creating 3D visualizations (recommends Three.js instead)
- Providing pre-built charts for simple use cases (encourages customisation)
- Handling tasks outside of d3.js visualization creation
Maintenance
- warning:Commit recencyThe last commit was over 8 months ago (October 2025), indicating potential staleness and risk if d3.js or related ecosystems have evolved significantly.
Versioning
- warning:Release ManagementNo explicit versioning information (like semver in frontmatter or GitHub releases) is present, and install instructions might default to `main`, making version pinning difficult.
Installation
npx skills add chrisvoncsefalvay/claude-d3js-skillRuns the Vercel skills CLI (skills.sh) via npx — needs Node.js locally and at least one installed skills-compatible agent (Claude Code, Cursor, Codex, …). Assumes the repo follows the agentskills.io format.
Quality Score
Similar Extensions
D3 Viz
98Creating interactive data visualisations using d3.js. This skill should be used when creating custom charts, graphs, network diagrams, geographic visualisations, or any complex SVG-based data visualisation that requires fine-grained control over visual elements, transitions, or interactions. Use this for bespoke visualisations beyond standard charting libraries, whether in React, Vue, Svelte, vanilla JavaScript, or any other environment.
Data Visualization
97Data visualization with chart selection, color theory, and annotation best practices. Covers chart types (bar, line, scatter, heatmap), axes rules, and storytelling with data. Use for: charts, graphs, dashboards, reports, presentations, infographics, data stories. Triggers: data visualization, chart, graph, data chart, bar chart, line chart, scatter plot, data viz, visualization, dashboard chart, infographic data, data presentation, chart design, plot, heatmap, pie chart alternative
Data Visualizer
99Create marketing visualizations from data. Use when: creating charts for reports; visualizing campaign performance; generating dashboards; presenting data insights; exporting charts for presentations
Measure Dashboard Requirements
100Specifies requirements for an analytics dashboard including metrics, visualizations, filters, and data sources. Use when requesting dashboards from data teams, defining KPI tracking, or documenting reporting needs.
Alterlab Nmc Data Journalist
100This skill should be used when the user asks about "data journalism", "data visualization", "data storytelling", "FOIA request", "RTI request", "spreadsheet analysis", "chart design", "act as a data journalist", "data journalist mode", "infographic", "open data", "statistical analysis for journalism", "investigative data", "public records", "Datawrapper", "Flourish", "Tableau Public", "D3.js", "chart type selection", or needs expertise in finding, analyzing, and visualizing data for journalistic storytelling. Part of the AlterLab FC Skills collection (New Media & Communication department).
Deepinit
100Deep codebase initialization with hierarchical AGENTS.md documentation