skills.rest
wwsun
wwsunCOMMUNITY
Explore all skills by this author →
Website𝕏@welles_sunGitHub

json-canvas

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

Updated Jun 18, 2017
Search Tags:#obsidian#flowchart#diagramming#mind map#json canvas#visual notes
One-click install
npx skills add https://github.com/wwsun/wwsun.github.io --skill json-canvas-wwsun
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: json-canvas
Source: https://github.com/wwsun/wwsun.github.io/tree/main/.agents/skills/json-canvas
Command: npx skills add https://github.com/wwsun/wwsun.github.io --skill json-canvas-wwsun

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill provides the tools to programmatically create and edit JSON Canvas files, which are used for visual note-taking and mind-mapping applications like Obsidian.

Core Features & Use Cases

  • Node Creation: Add text, file, link, and group nodes to a canvas.
  • Edge Creation: Define connections between nodes with customizable endpoints and labels.
  • File Structure: Understand and manipulate the JSON structure of .canvas files.
  • Use Case: Automatically generate a visual flowchart from a set of process steps defined in a text file, saving manual drawing time.

Quick Start

Use the json-canvas skill to create a new canvas with a text node containing 'Hello, Canvas!' at position (100, 100).

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 for Obsidian?▼

Create a JSON Canvas file by structuring a JSON object that adheres to the JSON Canvas Spec 1.0, defining nodes, edges, and groups to represent visual notes for Obsidian.

What is the JSON Canvas spec used for visual notes?▼

The JSON Canvas spec provides a structured data format for visual note-taking, enabling the creation of mind maps and flowcharts by defining text, file, link, and group nodes connected by labeled edges.

How do I programmatically add nodes and edges to a .canvas file?▼

You programmatically edit a .canvas file by injecting JSON objects for nodes with specific attributes and defining edges with customizable endpoints, labels, and unique generated IDs.

Can I automatically generate an Obsidian flowchart from text steps?▼

Yes, you can automatically generate a visual flowchart by parsing process steps from text and creating corresponding text nodes and connecting edges within the JSON Canvas format.

Does the JSON Canvas format support groups and customized connections?▼

Yes, the JSON Canvas format supports group nodes to cluster elements and edge definitions to establish connections with customizable endpoints and labels between individual nodes.

Related Skills

Explore More Design & Creative Skills→
zephyrwang6zephyrwang6
333

json-canvas

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

Community
Basic
TreasoniTreasoni

json-canvas

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

Community
Intermediate
ryan-ressmeyerryan-ressmeyer

json-canvas

Create and edit JSON Canvas files with nodes and edges per Spec 1.0.

Community
Intermediate
tanaka-mambingetanaka-mambinge

mermaid-diagrams

Convert plain-text diagram ideas into Mermaid diagrams for software architecture, data modeling, and process flows.

Community
Advanced