DiagramEditor

Import

svelte

import { DiagramEditor } from 'markgraphy';

Basic usage

svelte

<DiagramEditor />

Glyphs

Rounded

Light Box

Heavy Box

Double Box

Arrows

Meters

Input 620 chars · 13 lines

Preview

+ - - - - - - [ NESTED RADII ] - - - - - - +
|                                             |
|   ╭ - - - - - - - - - - - - - - - - - - ╮   |
|   |  outer   16px                       |   |
|   |     ╭ - - - - - - - - - - - - ╮     |   |
|   |◀ - ▶|  inner   12px           |     |   |
|   |     ╰ - - - - - - - - - - - - ╯     |   |
|   |          inset   4px                |   |
|   ╰ - - - - - - - - - - - - - - - - - - ╯   |
|                                             |
|        inner = outer - inset                |
|        12px = 16px - 4px                    |
+ - - - - - - - - - - - - - - - - - - - - - - +