Diagrams

💡TL;DR

Select several chart types in one run and choose multiple output formats independently for each type. Unchecking a type retains its format preferences; leaving every type unchecked uses automatic analysis.

Each diagram preview has independent zoom, pan, fit and actual-size controls. Ctrl/Command + wheel zooms; ordinary wheel scrolls. Large PNG exports retain the selected 72–600 PPI (default 300). SVG is vector-based; PPI applies only to raster exports.

Generate images compatible with Obsidian — Enabled by default. Check PNG decoding in Obsidian; if it fails, keep the requested original and add a lower-PPI copy. Both filenames show their PPI. Off exports only the requested PNG. (note_drawnix_300ppi.png, note_drawnix_obsidian_87ppi.png).

Understand the three choices

Choice	What it controls	Examples
Diagram type	What the diagram means	Flowchart, sequence diagram, circuit diagram, data chart
Source format	The editable or reusable file that Notemd creates	Mermaid, JSON Canvas, Draw.io, Drawnix, CircuitikZ
Export format	The image or document used for sharing	SVG, PNG, PDF

Diagram HTML contains a zoomable graphic; structured-summary HTML contains text, structure and evidence. Editable HTML/SVG is a renderer name, not an in-browser editor. Use native source for editing. Presentation export, including PPTX and MP4, keeps separate settings and dependencies.

Choose a source format

Format	Best for	Source file
Mermaid	Diagrams kept directly in Markdown	Mermaid code block
JSON Canvas	Native Obsidian canvas workflows	.canvas
Draw.io	Editing later in diagrams.net or compatible tools	.drawio
Drawnix	Hand-drawn or whiteboard-style editing	.drawnix
CircuitikZ	Structured electrical and transistor circuits	.tex

Supported formats appear first. Incompatible choices remain visible and disabled; existing inactive requests can be removed. Format choices stay with their chart type. If no requested format is usable, Notemd attempts the effective renderer’s default source and reports unavailable requests.

Generate and export a diagram

1. Open the supported source note. To visualize only a passage, put it in a separate note; selecting text does not narrow a file-based generation action.
2. Select several chart types in one run and choose multiple output formats independently for each type. Unchecking a type retains its format preferences; leaving every type unchecked uses automatic analysis.
3. Use the checkbox to include a type. Click its name to select it and edit its formats. Hover or keyboard focus changes the preview without saving. Escape closes the menu and returns focus.
4. Choose Generate diagram from the Notemd sidebar or command palette.
5. Selected files are exported automatically beside the source note, or directly into the configured output folder. Names include the type, such as topic_drawnix.pdf and topic_flowchart.svg; collisions add -2, -3 and so on without overwriting existing files.
6. Review the preview. A multi-panel result keeps the Drawnix board and every Mermaid panel in source order inside one vertically scrollable preview shell; Mermaid panels use their rendered height instead of being clipped.
7. Choose a panel's Export SVG, Export PNG, or Export PDF action for one visual, or use a top-level image export for all panels. For multiple panels, choose the source folder or a custom Vault-relative folder; Notemd writes one deterministic file per panel and continues after an individual failure. Use Save source file when you also need the editable artifact.

Set the diagram intermediate-files folder to a shared Vault-relative path, or leave it empty for notemd_assert/ beside each source. Recovery records, cached renders and optional attachments stay there. Retain files still referenced by existing exports; folder changes affect new runs only.

Types run sequentially. One failure does not block the others; cancellation stops pending types and preserves completed files. Retry failed exports through preview or history without another model request. A generation failure still requires generating that type again. Existing v1/v2 recovery records remain readable.

The Export menu provides Export SVG, Export PNG, and Export PDF actions for the current visual preview. Each panel header exposes the same actions for a single Mermaid or Drawnix visual, so a large preview does not have to be exported as one opaque image.

Choose History in the preview to open the Vault history drawer without hiding the diagram. You can search and filter completed diagrams, reopen a preview, or open saved artifacts. Diagram history is also available directly from the command palette and Notemd sidebar, even when no note is active.

SVG and PDF are produced from vector geometry; PDF uses the same SVG layout and text metrics instead of rasterizing the whole preview. The image export PPI in Notemd settings controls PNG rasterization only (72-600 PPI, 300 by default).

Readable previews for dense diagrams

Editable HTML/SVG lane-grid diagrams measure and wrap the summary before placing the title and lane header. The header is moved below that protected summary region, and cells are painted before connectors and edge labels. Cross-lane edges use collision-aware orthogonal grid routes that reserve lane labels and occupied cells, so long descriptions do not hide text or force a user to pan sideways to understand the diagram.

Mermaid quadrant charts receive a family-specific normalization pass. Flowchart-only quote and shape repairs are skipped for quadrantChart, and a provider-copied opening bracket is removed only when it is the unmatched trailing character of a point label. Intentional brackets in titles, axes, and quadrant names remain visible.

The repository keeps a real-Vault learning and evidence set for every executable diagram type. See docs/diagram-examples/ for bilingual inputs, generated SVG/PNG files and the machine-readable manifest. A passed entry refers to its recorded run and bundle identity; it does not establish a fresh run of every type on a later release.

The current executable catalog has 33 rows, while the plugin UI has 21 locales and the published website route set has 34 locales. These are different surfaces: UI locale count is not the same as published documentation locale count. Five exact reference grammars remain outside the selector until their layout contracts have independent evidence.

Drawnix previews with embedded Mermaid

When a Drawnix artifact contains Mermaid visuals, Notemd sanitizes the rendered SVG and keeps the Mermaid source alongside it in the .drawnix metadata. The preview can therefore show the Mermaid image inside the Drawnix knowledge map without requiring the Drawnix or Plait runtime. The default path is self-contained and does not create a separate .assets directory. Enable Also export complete Mermaid visuals when you need Mermaid source, SVG, and manifest companions for handoff or external editing. Existing artifacts with .assets remain supported, and a missing legacy Mermaid SVG can be rebuilt from source text retained in metadata.

Resolved image embeds receive a data-backed SVG preview when possible. Preview loading uses embedded data first, then legacy companion files, then source-text rebuilding where available. Keep existing companion files while artifacts still reference them; a self-contained new export does not prove that a shared old directory is unused.

The preview is intentionally a single scrollable surface: the main Drawnix canvas appears first, followed by each embedded Mermaid panel in source order. Closing and reopening a saved history entry reconstructs the same panel list, dimensions, and export actions.

Drawnix preserves all explicit directed relationships without a fixed total or per-node limit. Identical claims are deduplicated; different predicates and reverse directions remain distinct. Overlapping exterior routes use separate tracks, disjoint routes reuse tracks, and labels receive separate measured rows. The canvas grows to retain relationships. Unlabeled, generic or redundant hierarchy arrows remain in metadata with reasons. Boxed relation text stays visible in PDF, including older cached SVG. Cross-branch arrows remain static and may detach after rearrangement in Drawnix.

Native export boundaries

Source export and visual export are separate deliverables. Test a representative artifact in its destination application before distributing it. PowerPoint table export preserves supported editable table structure, including the corrected separators beneath merged cells; Mermaid and SVG content can use image fallback rather than editable native shapes. An in-plugin preview or a whole-page screenshot score is not a substitute for a native-consumer check.

Circuit diagrams

Choose Circuit diagram with CircuitikZ source file for supported circuit requests. Notemd generates a structured circuit description first and then writes the CircuitikZ source. This is more reliable than asking the model to write unrestricted LaTeX.

Current CircuitikZ support is intentionally constrained. Common-source NMOS amplifiers and supported CMOS building blocks work best. Always inspect the preview and source before using a generated circuit in technical or publication work.

The SVG preview is a review companion generated by Notemd. It is not proof that a local LaTeX or TikZJax installation compiled the .tex file successfully.

Optional native compilation. You do not need LaTeX for the in-plugin preview or SVG, PNG, and preview PDF export. On desktop, open CircuitikZ native compile environment from diagram settings or the command palette when you need compile diagnostics or a native LaTeX PDF. Notemd can reuse a system tectonic or pdflatex, use a custom executable, or install the pinned managed Tectonic runtime after you explicitly choose Install. The environment panel shows progress and errors inline and lets you remove the managed runtime later.

Troubleshooting

The result is the wrong diagram type

Select the diagram type explicitly instead of using Auto-detect. For a circuit, choose Circuit diagram and use the Generate diagram command, not the legacy Summarise as Mermaid diagram command.

A source format is unsuitable

Supported formats appear first. Incompatible choices remain visible and disabled; existing inactive requests can be removed. Format choices stay with their chart type. If no requested format is usable, Notemd attempts the effective renderer’s default source and reports unavailable requests.

The Export menu is missing

SVG, PNG, and PDF require a visual preview. If only source text is available, save the source file and open it in the matching external tool.

A CircuitikZ file does not compile externally

Open CircuitikZ native compile environment and run the environment check. Repair the managed runtime or verify that your custom/system compiler can obtain the circuitikz package. Notemd does not bundle a complete TeX distribution inside the plugin file.

1.9.10 — Safer previews and Vault-local settings

Imported SVG previews remove active content and external resources while preserving Chinese labels and panel styles. Device-only providers are now isolated by Vault; use the explicit legacy import action in settings, which preserves the old list and existing configurations. Presentation previews use a loopback server with shared-consumer lifecycle control. Failed favorites saves and clipboard writes report errors; deletion follows Vault preferences. PNG compatibility stays enabled by default, preserving the requested original and adding a verified lower-PPI copy only when needed. Drawnix has no fixed relation quota; presentation exports keep separate settings. Install matching release files, reload, and test one note before batching.

1.9.11 — Clearer diagrams and reliable PDF export

Drawnix places closely related branches nearer and reduces connector overlap and crossings, preserving every node and explicit relationship. Cross-branch arrows remain static after rearrangement.

PDF export handles complex SVG selectors and inherited styles after sanitization. Missing viewBoxes are restored; oversized pages are scaled proportionally while retaining vectors.

Diagnostics are grouped by tag and collapsed by default. Expand a group to read every message and suggestion; severity counts remain visible.

Logs accumulate across task stages and preview reopening during the plugin session. Use Clear log to reset them; reloading the plugin does not preserve the transcript.

1.9.12 — Quieter diagnostic previews

When there are no errors, the entire diagnostic panel is collapsed by default, leaving only its title and severity counts visible. Errors open the panel automatically. Expand the panel and its tag groups to read every message and suggestion. No diagnostic records are removed. Only error groups open automatically; warning and information groups stay collapsed, even when they share a tag.