d3-viz

Creating 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.

Quality

78%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

Securityby

Passed

No findings from the security scan

Fix and improve this skill with Tessl

tessl review fix ./docs/v19.7/configuration/agent/skills_external/antigravity-awesome-skills-main/skills/claude-d3js-skill/SKILL.md

The canonical home for this skill is claude-d3js-skill in sickn33/agentic-awesome-skills

Quality

Content

63%Weight 40%Scale 1-5

Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.

The content is highly actionable with executable examples and a clear workflow, but it is over-long, inlines material that belongs in its existing reference files, and ships broken asset references. Tightening the body and fixing the missing assets would lift the structure and token-efficiency scores.

Suggestions

Move the per-chart-type implementations (chord, heatmap, pie, force) and the full 'Scales reference' into references/d3-patterns.md and scale-reference.md, leaving concise overviews and links in SKILL.md to cut length and padding.

Either create the referenced assets/chart-template.js, interactive-template.js, and sample-data.json, or remove those bullet points from the Resources section so no broken references remain.

Trim definitional asides ('A chord diagram shows relationships...', 'A heatmap uses colour to encode values...') that restate concepts Claude already knows; keep only the actionable code and integration notes.

Dimension	Reasoning	Score
Conciseness	The body is very long (~810 lines) with many full chart implementations inlined and explanatory asides ('A chord diagram shows relationships...', 'A heatmap uses colour to encode values...') that restate concepts Claude already knows; mostly efficient but noticeably padded.	3 / 5
Actionability	Extensive copy-paste-ready functions covering common patterns (bar, line, scatter, chord, heatmap, pie, force, tooltips, zoom, transitions); minor gaps where snippets reference undefined `g`/`svg`/`circles` selections.	4 / 5
Workflow Clarity	A clear numbered core workflow (set up → choose pattern → structure → responsive) is present with a 'Common issues' troubleshooting section; not a destructive/batch skill so the validation cap does not apply, but explicit checkpoints inside steps are only implicit.	4 / 5
Progressive Disclosure	A Resources section signals real references/*.md files, but the body also references assets/chart-template.js, interactive-template.js, and sample-data.json that do not exist, and large reference-style content (scales reference, all chart patterns) is fully inlined rather than delegated to the dedicated reference files that exist.	3 / 5
	Total	14 / 20 Passed

Description

92%Weight 40%Scale 1-5

Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.

The description is strong: it states concrete capabilities, gives explicit 'use when' trigger guidance, and carves out a distinct niche (bespoke d3 visualisations beyond standard libraries). Minor trigger-synonym gaps keep trigger_term_quality just below the top anchor.

Dimension	Reasoning	Score
Specificity	Lists multiple concrete outputs ('custom charts, graphs, network diagrams, geographic visualisations') plus 'fine-grained control over visual elements, transitions, or interactions' — comprehensive concrete coverage matching the score-5 anchor.	5 / 5
Completeness	Explicitly answers both 'what' ('Creating interactive data visualisations using d3.js') and 'when' ('This skill should be used when...', 'Use this for bespoke visualisations...') with concrete trigger phrases.	5 / 5
Trigger Term Quality	Natural user terms ('charts, graphs, network diagrams') plus framework names (React, Vue, Svelte) are present, but synonym coverage and common variants are incomplete relative to the comprehensive score-5 example.	4 / 5
Distinctiveness Conflict Risk	Clear niche — bespoke SVG-based d3.js visualisations 'beyond standard charting libraries' — with distinct triggers and minimal overlap with other skills; written in third person with no voice penalty.	5 / 5
	Total	19 / 20 Passed

Validation

93%

Warnings & errors only

Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.

Validation — 15 / 16 Passed

Validation for skill structure

Criteria	Description	Result
skill_md_line_count	SKILL.md is long (821 lines); consider splitting into references/ and linking	Warning

	Total	15 / 16 Passed

Repository: duclm1x1/Dive-Ai
Path: docs/v19.7/configuration/agent/skills_external/antigravity-awesome-skills-main/skills/claude-d3js-skill/SKILL.md
Commit: 20ba150

Reviewed: ~17 hours ago

Table of Contents

Discovery Implementation Validation

Is this your skill?

If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.