72 lines
1.9 KiB
Markdown
72 lines
1.9 KiB
Markdown
|
# Excalidraw JSON Schema
|
||
|
|
|
||
|
|
## Element Types
|
||
|
|
|
||
|
|
| Type | Use For |
|
||
|
|
|------|---------|
|
||
|
|
| `rectangle` | Processes, actions, components |
|
||
|
|
| `ellipse` | Entry/exit points, external systems |
|
||
|
|
| `diamond` | Decisions, conditionals |
|
||
|
|
| `arrow` | Connections between shapes |
|
||
|
|
| `text` | Labels inside shapes |
|
||
|
|
| `line` | Non-arrow connections |
|
||
|
|
| `frame` | Grouping containers |
|
||
|
|
|
||
|
|
## Common Properties
|
||
|
|
|
||
|
|
All elements share these:
|
||
|
|
|
||
|
|
| Property | Type | Description |
|
||
|
|
|----------|------|-------------|
|
||
|
|
| `id` | string | Unique identifier |
|
||
|
|
| `type` | string | Element type |
|
||
|
|
| `x`, `y` | number | Position in pixels |
|
||
|
|
| `width`, `height` | number | Size in pixels |
|
||
|
|
| `strokeColor` | string | Border color (hex) |
|
||
|
|
| `backgroundColor` | string | Fill color (hex or "transparent") |
|
||
|
|
| `fillStyle` | string | "solid", "hachure", "cross-hatch" |
|
||
|
|
| `strokeWidth` | number | 1, 2, or 4 |
|
||
|
|
| `strokeStyle` | string | "solid", "dashed", "dotted" |
|
||
|
|
| `roughness` | number | 0 (smooth), 1 (default), 2 (rough) |
|
||
|
|
| `opacity` | number | 0-100 |
|
||
|
|
| `seed` | number | Random seed for roughness |
|
||
|
|
|
||
|
|
## Text-Specific Properties
|
||
|
|
|
||
|
|
| Property | Description |
|
||
|
|
|----------|-------------|
|
||
|
|
| `text` | The display text |
|
||
|
|
| `originalText` | Same as text |
|
||
|
|
| `fontSize` | Size in pixels (16-20 recommended) |
|
||
|
|
| `fontFamily` | 3 for monospace (use this) |
|
||
|
|
| `textAlign` | "left", "center", "right" |
|
||
|
|
| `verticalAlign` | "top", "middle", "bottom" |
|
||
|
|
| `containerId` | ID of parent shape |
|
||
|
|
|
||
|
|
## Arrow-Specific Properties
|
||
|
|
|
||
|
|
| Property | Description |
|
||
|
|
|----------|-------------|
|
||
|
|
| `points` | Array of [x, y] coordinates |
|
||
|
|
| `startBinding` | Connection to start shape |
|
||
|
|
| `endBinding` | Connection to end shape |
|
||
|
|
| `startArrowhead` | null, "arrow", "bar", "dot", "triangle" |
|
||
|
|
| `endArrowhead` | null, "arrow", "bar", "dot", "triangle" |
|
||
|
|
|
||
|
|
## Binding Format
|
||
|
|
|
||
|
|
```json
|
||
|
|
{
|
||
|
|
"elementId": "shapeId",
|
||
|
|
"focus": 0,
|
||
|
|
"gap": 2
|
||
|
|
}
|
||
|
|
```
|
||
|
|
|
||
|
|
## Rectangle Roundness
|
||
|
|
|
||
|
|
Add for rounded corners:
|
||
|
|
```json
|
||
|
|
"roundness": { "type": 3 }
|
||
|
|
```
|