DiaScript Guide

DiaScript is a tiny JavaScript library for creating SVG block diagrams.

Diagrams are mostly made of boxes.

Boxes can contain boxes. vbox and hbox lay out their children vertically and horizontally, respectively. The layout can be controlled with the padding and spacing properties.

Because of this, child boxes do not need x and y coordinates.

If a container box doesn't have an explicit height and width, it makes itself big enough to contain its children.

Boxes can also contain text. The align and valign properties control alignment. The bold function is a convenient helper function for bold text.

Lines...

Markers...

Shapes...

Top-level shapes can be positioned relative to another shape instead of using an absolute position using the align_to, dx, and dy properties.