JSON Canvas

Создание и редактирование файлов JSON Canvas (.canvas): узлы, рёбра, группы и связи. Используйте при работе с .canvas файлами, интеллект-картами, блок-схемами и визуальными канвасами в Obsidian.

Структура файла

{
  "nodes": [],
  "edges": []
}

Типовые рабочие процессы

1. Создать новый канвас

1. Создать .canvas файл с базовой структурой
2. Сгенерировать уникальные 16-символьные hex ID для каждого узла (например "6f0ad84f44ce9c17")
3. Добавить узлы с обязательными полями: id, type, x, y, width, height
4. Добавить рёбра, ссылающиеся на ID узлов через fromNode и toNode
5. Валидация: проверить корректность JSON, все fromNode/toNode существуют в массиве узлов

Узлы

Порядок в массиве определяет z-индекс: первый узел — нижний слой, последний — верхний.

Общие атрибуты узла

Text Node

{
  "id": "6f0ad84f44ce9c17", "type": "text",
  "x": 0, "y": 0, "width": 400, "height": 200,
  "text": "# Заголовок\n\nКонтент в **Markdown**."
}

Используйте \n для переносов строк. Не используйте буквальный \\n — Obsidian отобразит его как символы.

File Node

{
  "id": "a1b2c3d4e5f67890", "type": "file",
  "x": 500, "y": 0, "width": 400, "height": 300,
  "file": "Attachments/diagram.png",
  "subpath": "#Heading"
}

Link Node

{
  "id": "c3d4e5f678901234", "type": "link",
  "x": 1000, "y": 0, "width": 400, "height": 200,
  "url": "https://obsidian.md"
}

Group Node

{
  "id": "d4e5f6789012345a", "type": "group",
  "x": -50, "y": -50, "width": 1000, "height": 600,
  "label": "Обзор проекта", "color": "4",
  "background": "path/to/bg.png", "backgroundStyle": "cover"
}

Рёбра

{
  "id": "0123456789abcdef",
  "fromNode": "6f0ad84f44ce9c17", "fromSide": "right",
  "toNode": "a1b2c3d4e5f67890", "toSide": "left",
  "toEnd": "arrow", "label": "ведёт к"
}

Цвета

Генерация ID

16-символьные строчные hex-строки (64-битное случайное значение): "6f0ad84f44ce9c17"

Руководство по компоновке

• Координаты могут быть отрицательными (канвас бесконечен)
• x растёт вправо, y — вниз; позиция — верхний левый угол
• Отступ 50–100 px между узлами; 20–50 px padding внутри групп
• Выравнивание по сетке (кратно 10 или 20) для аккуратного вида

Чеклист валидации

1. Все значения id уникальны (узлы + рёбра)
2. Каждый fromNode и toNode ссылается на существующий узел
3. Обязательные поля присутствуют (text для text, file для file, url для link)
4. type — одно из: text, file, link, group
5. fromSide/toSide — одно из: top, right, bottom, left
6. fromEnd/toEnd — одно из: none, arrow
7. Пресеты цветов: "1"–"6" или валидный hex
8. JSON валиден и парсится (особенно переносы строк в text: \n, не \\n)