How do I install the Forcegraph Exporter skill?

Run npx skillmds@latest add acaprino/forcegraph-exporter in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.

Is Forcegraph Exporter safe to use?

This skill has not completed SkillMD's automated safety review yet. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.

Which AI agents work with Forcegraph Exporter?

This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.

Is Forcegraph Exporter free to use?

Yes. Installing skills from SkillMD is free, and the skill stays under its author's original license.

Who published Forcegraph Exporter?

acaprino (@acaprino) published this skill. Their other Agent Skills are listed on their SkillMD profile.

Forcegraph Exporter by acaprino — Agent Skill

Name: Forcegraph Exporter
Author: acaprino

Forcegraph Exporter

Render a JSON outline into a standalone browser page; needs internet for the CDN. TRIGGER WHEN: the user says 'interactive map', 'force graph', 'web mindmap', or 'HTML mindmap', or asks for a zoomable, draggable visual export. DO NOT TRIGGER WHEN: the user wants Obsidian MarkMind format (use markmind-exporter).

acaprino c243019 2 files · 9.8 KB Updated Sep 17, 2026

File contents

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 .html file

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)

---name: forcegraph-exporterdescription: Render a JSON outline into a standalone browser page; needs internet for the CDN. TRIGGER WHEN: the user says 'interactive map', 'force graph', 'web mindmap', or 'HTML mindmap', or asks for a zoomable, draggable visual export. DO NOT TRIGGER WHEN: the user wants Obsidian MarkMind format (use markmind-exporter).---# Force Graph ExporterConvert a mindmap JSON outline into an interactive HTML file with a force-directed graph visualization powered by [force-graph](https://github.com/vasturiano/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.## InputA JSON file with the standard mindmap outline format (same as generate-mindmap output):```json{ "root": "Central Theme", "branches": [ { "text": "Branch One", "color": "#ff6b6b", "children": [ { "text": "Sub-concept A", "children": [...] } ] } ]}```## Workflow### Step 0: Check for inputIf 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 JSONFind 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```bashpython scripts/generate_forcegraph.py --input outline.json --output /path/to/mindmap.html --max-depth 6```Or from stdin:```bashcat 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 `.html` file### Step 3: DeliverPresent 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)

Frequently asked questions