Search results

Layer API in React Diagram API component

A collection of JSON objects where each object represents a layer. Layer is a named category of diagram shapes.

Properties

addInfo

Object

Defines the description of the layer

<div id='diagram'></div>
let nodes: NodeModel[] = [{
          id: 'node1', width: 100, height: 100, offsetX: 100, offsetY: 100,
          annotations: [{ content: 'Default Shape' }]
      },
      {
          id: 'node2', width: 100, height: 100, offsetX: 300, offsetY: 100,
          shape: {
              type: 'Basic', shape: 'Ellipse'
          },
          annotations: [{ content: 'Path Element' }]
      }
      ];
      let connectors: ConnectorModel[] = [{
          id: 'connector1',
          type: 'Straight',
          sourcePoint: { x: 100, y: 300 },
          targetPoint: { x: 200, y: 400 },
      }];
let diagram: Diagram = new Diagram({
...
      connectors: connectors, nodes: nodes,
      layers: [{ id: 'layer1', visible: true, objects: ['node1', 'node2', 'connector1'] }],
...
});
diagram.appendTo('#diagram');

Defaults to undefined

id

string

Defines the id of a diagram layer

Defaults to

lock

boolean

Enables or disables editing objects in a particular layer

Defaults to false

objects

string[]

Defines the collection of the objects that are added to a particular layer

Defaults to undefined

visible

boolean

Enables or disables the visibility of objects in a particular layer

Defaults to true

zIndex

number

Defines the zOrder of the layer

Defaults to -1