Skip to content

Output composition

These contracts support custom renderer and codec implementations. For application exports, use the output API.

SVG geometry adapter

DiagramSvgGeometry in vyuh_diagram_codecs serializes resolved outlines to SVG path data in pure Dart. It is a geometry primitive, not a complete diagram SVG exporter.

MethodInputResult
outlinePath(outline)ResolvedOutlineSVG d data for a rectangle (including fitted circular corners), ellipse, polygon, or open authored path.
connectorBodyPath(connector)ResolvedConnectorVisible endpoint-trimmed body polyline in world coordinates; empty if fewer than two body points.
arrowheadPath(arrowhead)ResolvedArrowheadResolved terminal-marker path, preserving its open/closed contour. Use filled to select fill versus stroke.
inkHullPath(outline)AuthoredPathOutlineClosed filled pressure-stroke hull, or an empty string when no hull exists.

Arcs use SVG arc commands; coordinates are serialized without deliberate decimal rounding. Nonfinite coordinates and nonpositive outline bounds are rejected. Outline implementations outside the closed grammar throw UnsupportedError.

The output uses the same unrotated resolved coordinates as the canvas outline. A complete exporter must still compose owner transforms, ancestor and content clips, styles, connectors, text, images and document metadata. Stroke hulls are separate from authored centerlines so consumers can preserve the canvas's choice of filled pressure geometry or styled centerline. The adapter does not infer missing text shaping or emit a partial diagram while pretending to export it all.

Connector output serializes bodyPoints, exactly as the canvas does. Quadratic and cubic routes therefore retain the resolver's authoritative sampled polyline; the adapter does not rebuild curves from controls or use animation resampling. Marker trimming is already present in that body. Labels, their ink masks, ancestor clipping, color and dash styling still belong to scene composition.

SVG paint attributes

DiagramSvgPaint in vyuh_diagram_codecs supplies immutable SVG attribute maps for geometry composition:

MethodInputResult
shapeAttributes(style)ShapeStyleRegular surface fill, alpha, stroke width, dash rhythm and caps. Zero-width borders emit stroke="none".
connectorAttributes(connector)ConnectorElementUnfilled connector body stroke, with rounded joins and geometry-appropriate caps.

Both consume StrokeStyle.pattern, the same world-space dash/gap grammar used by committed and preview painting. Solid strokes have no dash pattern; dashed strokes use 8/5 with butt caps, and dotted strokes use 1/5 with round caps. Colors retain their alpha. Invalid color ranges and negative or non-finite widths are rejected.

These are composition primitives, not a complete SVG scene exporter. They do not apply transforms, ancestor clips, pressure-ink fill rules, text, labels, images, or decorative layers. Hosts must not apply regular shape surface paint to standalone text or pressure ink.

SVG placement and clips

MethodResult
DiagramSvgGeometry.outlineTransform(element)SVG rotation mapping a resolved framed element's outline to world space.
DiagramSvgGeometry.ancestorClips(element, scene)Immutable list of (path, transform) records for clipping ancestors, nearest first.

Use an element and scene from the same captured publication. Resolved framed sources already contain composed owner placement; applying parent transforms again would position them twice. Each ancestor clip is an independent intersection: nest clip groups instead of putting all paths into one SVG clip (which would union them). Missing or cyclic resolved ownership fails explicitly.

scene.clippingAncestorsOf(element) is also consumed by canvas painting, text/effect clipping, minimaps, accessibility bounds and hit testing. SVG maps those same outlines into world space. These placement primitives are also consumed by DiagramSvgScene.

For font-aware Dart VM rendering without Flutter, use the optional native headless text adapter and pass its resolved scene to the same SVG codec.

exportDiagramPng

The editor package also accepts an already captured publication:

dart
Future<PngSnapshot> exportDiagramPng(
  DiagramPublication publication, {
  required PngOptions options,
  ImageProvider<Object> Function(DiagramImageSource)? imageProvider,
})

The publication must contain matching canonical state and resolved geometry. Options, result, and asynchronous failure contracts match the session method. This function also requires Flutter.