Canvas Export

by rmoff
5
4
3
2
1
Score: 31/100

Description

Obsidian plugin to export canvas files to HTML, Excalidraw, Mermaid, D2, and PDF

Reviews

No reviews yet.

Stats

2
stars
3,812
downloads
1
forks
149
days
149
days
149
days
2
total PRs
0
open PRs
0
closed PRs
2
merged PRs
2
total issues
2
open issues
0
closed issues
13
commits

Latest Version

5 months ago

Changelog

What's changed

Resolves the four warnings reported by the Obsidian community-plugin scorecard against 1.0.1 — no behaviour change for end users.

Fixes

  • Type the implicit any from Plugin.loadData() and JSON.parse(...) in main.ts and src/converters.ts (@typescript-eslint/no-unsafe-assignment).
  • Use window.setTimeout instead of activeWindow.setTimeout for the PDF render delay (obsidianmd/prefer-window-timers).

Tooling and docs

  • Add eslint-plugin-obsidianmd (the same plugin the reviewer bot runs) as a devDependency, with eslint.config.mjs and an npm run lint script.
  • Add CONTRIBUTING.md covering build, lint, issues, PRs, and releases.
  • Bump typescript devDependency to 4.9.5 to satisfy the new lint plugin's peer-dep requirements.

Full changelog: https://github.com/rmoff/obsidian-canvas-export/compare/1.0.1...1.0.2

README file from

Github

Canvas Export

An Obsidian plugin that exports .canvas files to multiple formats:

  • HTML (light and dark themes) — fully self-contained, clickable links
  • Excalidraw (.excalidraw) — editable diagrams
  • Mermaid (.mmd) — text-based flowcharts
  • D2 (.d2) — declarative diagrams
  • PDF — print-ready via Electron

Usage

Open a .canvas file, then use the Command Palette (Cmd/Ctrl+P):

  • Canvas Export: Export to HTML (light)
  • Canvas Export: Export to HTML (dark)
  • Canvas Export: Export to Excalidraw
  • Canvas Export: Export to Mermaid (.mmd)
  • Canvas Export: Export to D2 (.d2)
  • Canvas Export: Export to PDF
  • Canvas Export: Export current canvas... — multi-format picker modal
  • Canvas Export: Re-export with last settings

You can also right-click a .canvas file in the file explorer and select Export Canvas....

If the output file already exists, you'll be prompted to overwrite, save with a numbered name, or skip.

What gets exported

Canvas files follow the JSON Canvas spec and can contain four types of nodes: text, groups, file embeds, and link embeds. Not all of these translate equally to every format.

All formats

Feature How it's handled
Text nodes Exported with basic Markdown rendering (headings, bold, italic, links, lists)
Groups Rendered as containers with labels
Edges (arrows) Preserved with correct anchoring and direction
Node colors Mapped to each format's color system (Obsidian's 6 preset colors + custom hex)
YAML frontmatter in text nodes Stripped automatically (used by plugins like Canvas Candy)
Images / file embeds Shown as a placeholder with the filename (e.g. 📄 diagram.png) — images are not embedded
Link embeds (iframes) URL is displayed as text/link — iframe content is not rendered

Format-specific notes

HTML (light/dark)
  • Fully self-contained single-file output — no external dependencies
  • Markdown links become clickable <a> tags with target="_blank"
  • Bare URLs are auto-linked
  • Canvas dimensions are preserved exactly (absolute positioning)
  • Both themes use the same layout; only colors differ
Excalidraw
  • Outputs raw .excalidraw JSON (opens in Obsidian's Excalidraw plugin in compatibility mode, or in excalidraw.com)
  • Single-link text nodes: the link URL is attached to the rectangle element (clickable in Excalidraw)
  • Multi-link text nodes: URLs are shown inline in the text (e.g. label (https://...)) since Excalidraw only supports one link per element
  • Markdown formatting is stripped to plain text
  • Groups rendered as dashed rectangles with labels
Mermaid
  • Outputs a flowchart TD diagram
  • Groups become subgraph blocks
  • All text is stripped to plain text with URLs shown inline
  • Node colors applied via style directives
  • Edge labels preserved
D2
  • Outputs a direction: down diagram
  • Groups become nested containers with optional styling
  • Nodes inside groups use qualified IDs (e.g. group.node)
  • Link nodes get a .link property
  • Colors applied via style blocks
PDF
  • Renders the light HTML theme to PDF via Electron's printToPDF
  • Page size matches the canvas dimensions
  • Requires desktop Obsidian (Electron)
  • If PDF generation fails (e.g. Electron API unavailable), a warning is shown but other formats still export

Settings

  • Group title size (%) — font size of group labels relative to body text (default: 150%)
  • Output subfolder — leave empty to export alongside the canvas, or specify a subfolder name

Installation

From Obsidian Community Plugins

  1. Open Settings -> Community plugins -> Browse
  2. Search for "Canvas Export"
  3. Click Install, then Enable

Manual

  1. Download main.js, manifest.json, and styles.css from the latest release
  2. Create .obsidian/plugins/canvas-export/ in your vault
  3. Copy the three files into that folder
  4. Enable the plugin in Settings -> Community plugins

Desktop only

This plugin uses Electron APIs for PDF export and is desktop-only.

Author

Robin Moffatt (@rmoff)

License

Apache License 2.0