skills.rest
levi-qiao
levi-qiaoCOMMUNITY
Explore all skills by this author →
𝕏@guannanjiayouGitHub

json-canvas

Create and edit nodes and edges in JSON canvas files.

6|1|Updated Apr 24, 2026
Search Tags:#workflow#visualization#canvas#mind map#diagram
One-click install
npx skills add https://github.com/levi-qiao/obsidian-llm-wiki --skill json-canvas-levi-qiao
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: json-canvas
Source: https://github.com/levi-qiao/obsidian-llm-wiki/tree/main/.claude/skills/json-canvas
Command: npx skills add https://github.com/levi-qiao/obsidian-llm-wiki --skill json-canvas-levi-qiao

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill facilitates the creation and modification of JSON-based canvas files, enabling users to visually organize information, ideas, and workflows in an easily editable format.

Core Features & Use Cases

  • Custom Canvas Creation: Generate new .canvas files with nodes and edges, supporting mind maps, flowcharts, and organizational charts.
  • Node Management: Add, edit, or connect nodes such as text, files, links, and groups, allowing detailed visual structuring.
  • Use Case: For example, a user can design a mind map of project phases, connecting nodes with labeled edges to show dependencies or flow.

Quick Start

Use the json canvas skill to add a new node labeled 'Review' connected to an existing node 'Draft' in your .canvas file.

Frequently Asked Questions about json-canvas

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create a mind map using a JSON canvas file?▼

You can edit existing JSON canvas files by modifying node positions, updating labels, and validating connection rules. This skill allows you to add, edit, or connect elements like text and links to manage complex visual structures within your diagram.

What is the process for adding a new node to an existing flowchart canvas?▼

Node positioning in a JSON canvas requires defining spatial coordinates to visually organize elements without overlap. This skill manages the generation of node IDs and spatial positioning to maintain an organized visual layout for your diagrams.

Can I use this to build organizational charts with connected text and file nodes?▼

Yes, you can build organizational charts by creating canvas files with connected text, file, and group nodes. This skill enables detailed visual structuring by allowing you to connect various node types with labeled edges to show flow and dependencies.

Do I need to understand connection validation to manage complex visual diagrams?▼

Yes, understanding connection validation is necessary to manage complex visual diagrams effectively. This skill requires knowledge of node ID generation and connection rules to ensure edges between nodes are structurally sound within the JSON canvas format.

Related Skills

Explore More Content & Communication Skills→
markdown-viewermarkdown-viewer
3.1k

canvas

Generate spatial JSON canvas diagrams with positioned nodes and edges.

Official
Intermediate
joonlabjoonlab
8

pdf-slide-viewer

Converts PDF documents into interactive HTML slide viewers with thumbnail navigation and fullscreen mode.

Community
Intermediate
northseadlnorthseadl

json-canvas

Create and edit JSON Canvas files with nodes and edges.

Community
Intermediate
tharunramagiritharunramagiri

tarunai-connect-mermaid

Create and manage Mermaid diagrams via command-line interface with JSON output.

Community
Intermediate