skills.rest
ldiex
ldiexCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

json-canvas

Create and edit JSON Canvas files with nodes, edges, and groups.

Updated Nov 8, 2025
Search Tags:#nodes#obsidian#canvas#diagram#edges#json-canvas
One-click install
npx skills add https://github.com/ldiex/configs --skill json-canvas-ldiex
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: json-canvas
Source: https://github.com/ldiex/configs/tree/main/.claude/skills/json-canvas
Command: npx skills add https://github.com/ldiex/configs --skill json-canvas-ldiex

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

JSON Canvas files provide a structured, extensible format to represent complex diagrams (nodes, edges, and groups) for visual planning in Obsidian and compatible apps, enabling consistent canvas workflows without manual JSON wiring.

Core Features & Use Cases

  • Create and edit canvas files with node types text, file, link, and group
  • Define edges to connect nodes with optional labels, colors, and layout hints
  • Visualize mind maps, flowcharts, and project boards with z-index ordering and grouping
  • Use cases include planning ideas, outlining projects, and annotating diagrams for documentation

Quick Start

Create a new canvas file named example.canvas and add two text nodes connected by an edge.

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 JSON Canvas file with connected nodes for Obsidian?▼

To create a JSON Canvas file for Obsidian, you define text, file, link, or group nodes with required fields like id, type, x, y, width, and height, then connect them using edges that specify fromNode and toNode.

What is the JSON Canvas format used for in diagram creation?▼

The JSON Canvas format is used to represent complex diagrams like mind maps and flowcharts by structuring nodes, edges, and groups, enabling consistent visual planning workflows in Obsidian and similar compatible apps.

Can I use JSON Canvas to build mind maps and flowcharts in Obsidian?▼

Yes, you can use JSON Canvas to build mind maps and flowcharts in Obsidian by defining text, file, link, and group nodes, connecting them with labeled edges, and applying color and layout options.

How do edges work when connecting nodes in a JSON Canvas diagram?▼

Edges in a JSON Canvas diagram work by referencing the unique IDs of nodes using the fromNode and toNode fields, allowing you to connect elements with optional labels, colors, and layout hints.

Does JSON Canvas validate unique IDs and structural constraints for nodes?▼

Yes, JSON Canvas enforces structural constraints by validating unique IDs for nodes and edges, ensuring required fields like id, type, x, y, width, and height are present and correctly formatted.

What node types are supported in a JSON Canvas file?▼

JSON Canvas files support four node types: text, file, link, and group, allowing you to structure content, reference external files, embed URLs, and visually cluster related diagram elements.

Related Skills

Explore More Design & Creative Skills→
northseadlnorthseadl

json-canvas

Create and edit JSON Canvas files with nodes and edges.

Community
Intermediate
lucasbenevinutolucasbenevinuto

json-canvas

Create and edit JSON Canvas files for Obsidian with nodes and edges.

Community
Intermediate
songzhuozhusongzhuozhu
118

json-canvas

Create, edit, and validate JSON Canvas files with nodes and edges.

Community
Intermediate
kirakuiinkirakuiin

json-canvas

Create and edit JSON Canvas .canvas files with nodes and edges.

Community
Intermediate