LayerView

This is a standalone view which can be used without a model. It inherits from mvc.View and is responsible for positioning and rendering arbitrary SVG elements in an ordered way.

constructor

const layerView = new MyCustomLayerView({
    id: 'some-id',
    // other options you want to pass to the constructor
});

The constructor accepts an options object with numerous settings:

id

id: string;

[required] A unique identifier of the layer view.

Methods

insertNode()

layerView.insertNode(node: SVGElement): void;

Append an SVG node into the layer view.

insertPivot()

layerView.insertPivot(z: number): Comment;

Insert a pivot node represented as a Comment DOM element into the layer view at the correct position according to the given z-index.

insertSortedNode()

layerView.insertSortedNode(node: SVGElement, z: number): void;

Insert an SVG node into the layer view at the correct position according to the given z-index.

isEmpty()

layerView.isEmpty(): boolean;

Return true if the layer view does not contain any child elements.

reset()

layerView.reset(): void;

Reset pivot nodes.

Properties

id

layerView.id: string;

Layer view identifier.

pivotNodes

layerView.pivotNodes: { [z: number]: Comment };

A set of pivot nodes represented as Comment DOM element. Pivot nodes are used to position layer view contents in the right place when inserting nodes.

Types

Options

interface Options<T extends mvc.Model | undefined = undefined> extends mvc.ViewOptions<T, SVGElement> {
    id: string;
    paper: dia.Paper;
    type?: string;
}