acaprino/forcegraph-exporter
plugins/learning/skills/forcegraph-exporter/SKILL.md
Export a mindmap JSON outline as an interactive HTML file using force-graph (requires internet for CDN). Use this skill when the user wants an interactive, web-based, zoomable/draggable visualization of a mindmap. TRIGGER WHEN: the user says 'interactive map', 'force graph', 'web mindmap', 'HTML mindmap', or asks for a visual/interactive export. DO NOT TRIGGER WHEN: the user wants Obsidian MarkMind format (use markmind-exporter) or a static text outline.
development
Updated Apr 20, 2026
$ install --global
skillsauthnpx skillsauth add acaprino/anvil-toolset forcegraph-exporterInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
Security Scan Results
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
3
Scanners Passed
9
Scanners in report
Clean
TrivyContainer and dependency vulnerability scanner
95%
Clean
SemgrepStatic code analysis for vulnerabilities
95%
Clean
mcp-scan (Snyk)Model Context Protocol security validation
95%
Skipped
Snyk (dep)Open source security scanning
50%
Skipped
Socket.devSupply chain security analysis
50%
Skipped
VirusTotalMulti-engine malware detection
50%
Skipped
CrowdStrikeAdvanced threat intelligence
50%
Skipped
OSV-ScannerOpen Source Vulnerability database check
50%
Skipped
OWASP Dep-Check
50%
Last scanned: Apr 20, 2026, 4:03 AM9.8s2 files scanned
SKILL.md
- name:
- forcegraph-exporter
- description:
- >
- TRIGGER WHEN:
- the user says 'interactive map', 'force graph', 'web mindmap', 'HTML mindmap', or asks for a visual/interactive export.
- DO NOT TRIGGER WHEN:
- the user wants Obsidian MarkMind format (use markmind-exporter) or a static text outline.
Force Graph Exporter
Convert a mindmap JSON outline into an interactive HTML file with a force-directed graph visualization powered by force-graph. The output file can be opened in any browser -- no server required, but needs internet to load the force-graph library from CDN.
Input
A JSON file with the standard mindmap outline format (same as generate-mindmap output):
{
"root": "Central Theme",
"branches": [
{
"text": "Branch One",
"color": "#ff6b6b",
"children": [
{ "text": "Sub-concept A", "children": [...] }
]
}
]
}
Workflow
Step 0: Check for input
If no mindmap JSON is available (no file path, no prior generate-mindmap output, no inline JSON in the conversation), invoke the learning:generate-mindmap skill first to brainstorm and produce the JSON outline. Then continue with Step 1.
Step 1: Locate the mindmap JSON
Find the mindmap outline JSON -- either a file path provided by the user, output from a prior generate-mindmap invocation, or inline JSON.
Step 2: Run the exporter
python scripts/generate_forcegraph.py --input outline.json --output /path/to/mindmap.html --max-depth 6
Or from stdin:
cat outline.json | python scripts/generate_forcegraph.py --output /path/to/mindmap.html
Options:
--max-depth N-- maximum depth levels below root (default: 6, max: 10)
The script:
- Converts the mindmap JSON tree into a flat nodes/links structure
- Loads force-graph library from CDN (unpkg.com, pinned version) in the HTML
- Colors nodes and links by their L2 branch color
- Sizes nodes by depth (root largest, leaves smallest)
- Adds labels, hover tooltips, and click-to-focus
- Produces a single
.htmlfile
Step 3: Deliver
Present the generated .html file to the user. Mention it can be opened directly in any browser.
Checklist Before Delivery
- HTML file opens in browser without errors
- All nodes from the mindmap JSON are present in the graph
- Root node is visually prominent (larger, centered)
- Branch colors match the original outline
- Graph is interactive (drag, zoom, hover)
- Internet connection available (CDN dependency for force-graph library)
Related Skills
acaprino/frontend-css
development
VerifiedTrustedCommunity
Unified web frontend knowledge base covering CSS architecture, UX psychology, UI components, distinctive aesthetics, and interface design generation. TRIGGER WHEN: working on web styling, design systems, component decisions, responsive strategy, distinctive frontend aesthetics, or exploring multiple interface designs. DO NOT TRIGGER WHEN: the task is purely backend or unrelated to web frontend.
5SKILL.mdUpdated May 13, 2026
acaprino/multi-reviewer-patterns
development
VerifiedTrustedCommunity
Coordinate parallel code reviews across multiple quality dimensions with finding deduplication, severity calibration, and consolidated reporting. Use this skill when organizing multi-reviewer code reviews, calibrating finding severity, or consolidating review results.
5SKILL.mdUpdated Apr 1, 2026
acaprino/codebase-mapper
tools
VerifiedTrustedCommunity
Knowledge base for the codebase-mapper plugin. Provides writing guidelines, tone rules, and diagram conventions for generating human-readable project guides. Referenced by all codebase-mapper agents during document generation. TRIGGER WHEN: referenced by codebase-mapper pipeline agents (codebase-explorer, overview-writer, tech-writer, flow-writer, onboarding-writer, ops-writer, config-writer, guide-reviewer) during document generation. DO NOT TRIGGER WHEN: outside the /map-codebase pipeline (general documentation work should use docs:readme-craft or codebase-mapper:docs-create).
5SKILL.mdUpdated Mar 26, 2026
acaprino/pwa-development
tools
VerifiedTrustedCommunity
Progressive Web App knowledge base for 2025-2026: Web App Manifest, Service Workers (Workbox 7, Serwist), Web Push (VAPID, RFC 8030/8291/8292, Declarative Push for Safari 18.4+), install flows (beforeinstallprompt, Window Controls Overlay), OPFS storage, Project Fugu, Core Web Vitals (INP < 200ms), security (HTTPS, CSP, COOP/COEP), and distribution (Bubblewrap, PWA Builder MSIX, Capacitor). TRIGGER WHEN: building, auditing, or debugging PWAs, including manifest, service worker, Web Push, install flow, OPFS, Background Sync, Wake Lock, vite-plugin-pwa, Next.js Serwist, @angular/pwa, @vite-pwa/nuxt, Bubblewrap, TWA, PWA Builder, or Capacitor wrapping. DO NOT TRIGGER WHEN: the task is generic frontend styling (use frontend), React performance (use react-development:review-react), cross-platform security unrelated to PWA (use platform-engineering), Tauri or Electron wrappers (use tauri-development), or GA4 / analytics (use digital-marketing).
3SKILL.mdUpdated May 26, 2026