Fix Mermaid visual editor problems

Two questions cover nearly all of it: why the button is missing, and why the canvas looks different from the published diagram.

Both have straightforward answers.


#What this is for

  • No visual editor button on a Mermaid diagram.

  • A canvas that differs from what the page shows.

  • A gesture that does nothing.


#How it works

Action

How

No button

The diagram is a Mermaid type the visual editor does not support.

Canvas differs from the page

The canvas is an editing view; the page uses the full renderer. Save and compare.

A gesture does nothing

Some structures, subgraphs in particular, are code pane work.

Nothing loads

Hard reload, then a private window.


#A few things that catch people out

  • The published diagram is always rendered from the source, so the source is what to check.

  • If a gesture is unsupported, the equivalent edit in the code pane always works.

  • Broader symptoms are in Troubleshooting.



Drag it. The text keeps up.