Advanced Techniques
Containers, scene mutations, node resizing, z-ordering, plugins, serialization, SVG export, and perimeter anchors.
Containers, scene mutations, node resizing, z-ordering, plugins, serialization, SVG export, and perimeter anchors.
Add motion to your visualizations with timeline-based animations, CSS animations, and playback controls.
Stop hand-placing x/y — let deterministic layout engines (layered, grid, stack) position nodes and container children.
Group nodes inside auto-sizing container frames, mark logical regions with zones, and collapse groups into summary nodes.
Use fromSpec to build VizCraft scenes from plain JSON objects — ideal for AI-generated content, serialized scenes, and data-driven visualization.
Attach edges to node sides or named ports, exit containers cleanly, route around obstacles, and separate parallel edges.
Route edges, add markers and labels, use ports for precise anchoring, create self-loops and dangling edges.
Handle click events, hit testing, port snapping, rubber-band selection, tooltips, and pan/zoom.
Position nodes manually, use the grid system, or apply automatic layout algorithms.
Create and style nodes with 22 built-in shapes, drop shadows, sketch mode, embedded images, and icons.
Add annotation layers, signals, selection rectangles, and custom overlay kinds.
Type your edges and nodes semantically instead of hand-colouring them, auto-generate legends, add titles and sticky-note annotations.
Drive interactive step-through explanations with createStepController — no Redux, no external animation loop.