d3js
About
This skill enables developers to create fully customized, interactive data visualizations using D3.js, offering complete control over SVG elements and data binding. It's ideal for building unique, complex charts with sophisticated transitions and interactions that standard libraries can't achieve. Use it when you need bespoke, data-driven visualizations rather than simple, pre-styled charts.
Quick Install
Claude Code
Recommendednpx skills add majiayu000/claude-skill-registry -a claude-code/plugin add https://github.com/majiayu000/claude-skill-registrygit clone https://github.com/majiayu000/claude-skill-registry.git ~/.claude/skills/d3jsCopy and paste this command in Claude Code to install this skill
GitHub Repository
Frequently asked questions
What is the d3js skill?
d3js is a Claude Skill by majiayu000. Skills package instructions and resources that Claude loads on demand, so Claude can perform d3js-related tasks without extra prompting.
How do I install d3js?
Use the install commands on this page: add d3js to Claude Code as a plugin, or clone its repository into your skills directory, then restart Claude so it picks up the skill.
What category does d3js belong to?
d3js is in the data-visualization category, tagged charts, d3, svg, interactive and custom-viz.
Is d3js free to use?
Yes. d3js is listed on AIMCP and free to install. It runs inside Claude, so no separate service account is required to use the skill itself.
Related Skills
This skill provides the CDN script tag to embed Plotly.js directly into web projects for interactive data visualizations. It's ideal for developers needing quick client-side charting without build tools or npm dependencies. The skill also includes complementary installation commands for Python/R Plotly backends.
This skill enables developers to apply custom visual themes to Highcharts visualizations. It provides reference code for globally configuring colors, backgrounds, fonts, and other styling options using `Highcharts.setOptions()`. Use this skill when you need to maintain consistent branding or styling across multiple charts in your application.
This Highcharts skill enables rendering large datasets (thousands+ points) using WebGL acceleration for improved performance. It includes the Boost module for GPU-optimized rendering along with annotations and drill-down capabilities for interactive data exploration. Use this when visualizing massive datasets where standard rendering would cause performance issues.
This skill provides TypeScript type definitions and examples for using ECharts charts in TypeScript projects. It includes the `EChartsOption` type for type-safe chart configuration and demonstrates proper imports and initialization. Use this reference when building data visualizations with ECharts in TypeScript to get autocomplete and type checking.