The VGraph Editor — draw diagrams by writing them

What this is

A diagram editor that takes text. You describe nodes, edges and groups in VGL, and the diagram lays itself out — no dragging boxes into place, no arrows to straighten. Each notation carries its own rules, so the editor will not let you draw something the notation forbids.

It runs entirely in your browser. Nothing you type is uploaded, and there is no account to make. Save VGL gives you the source; Save SVG gives you a picture that is also a document — it carries its own VGL inside, so opening it here brings the diagram back, editable.

Start from an example

Each of these opens a diagram that lives on this site — edit it, and save your version; the original stays where it is.

• Why am I always tired? — a causal loop, small enough to read in one go
• How learning works — a concept map
• Increase profitability — a goal tree
• Sales decline — a current reality tree
• Internet banking — a C4 model
• Data confidentiality — an attack-defense tree
• The Napoleonic wars — a timeline, on a notation defined inside the file itself

Every diagram on this site is written in VGL, so the notation reference doubles as a gallery: each page shows what its notation is for, and what it refuses to draw.

Where to go next

• Concepts — nodes, edges, groups, attributes
• Grammar — the formal syntax
• Notation reference — every built-in notation, with runnable examples
• User-defined notations — when none of them fit