Namespace Syncfusion.JavaScript.DataVisualization.Models.Diagram

Classes

Alignment To initialize a label can be aligned relative to the node boundaries.

AutoScrollBorder Defines auto scroll border for all left, right, top, and bottom sides. Default value for all is 15.

BackgroundImage Defines whether the BackgroundImage is stretchable and align the background image anywhere over the diagram area. ///

BasicShape Diagram provides support to add different kind of nodes.

BPMNAnnotation Text annotation is one of the artifact, which is used to show additional information about a process to make it easier to understand.

BPMNDataObject A data object represents information flowing through the process, such as data placed in the process, data resulting from the process, and more.

BPMNEvent An event is notated with a circle and it represents an event in a business process.

BPMNNode BPMN shapes are used to represent the internal business procedure in a graphical notation and allows you to communicate the procedures in a standard manner.

BPMNSubProcess Subprocess is a group of tasks used to hide or reveal details of additional levels, which can be done using the collapsed property.

BPMNTask The BPMNTask allows you to define the type of task such as sending, receiving, user-based task, and more. By default, the type is set to “none”.

Command Defines a combination of keys and key modifiers on recognition of which the command will be executed.

CommandManager Command Manager provides support to define custom commands. The custom commands are executed when the specified key gesture is recognized.

ConnectionDataSourceSettings Configures data source for Diagram to create the connection by using ID and parent name as per given data.

Connector Connectors are objects used to create link between two points, nodes or ports to represent the relationships between them.

ConnectorShape The connector shape specifies as either BPMN or UMLClassifier or None. Default valus is None.

Container Containers are used to automatically measure and arrange the size and position of the child elements in a predefined manner.

CRUDAction CRUD feature allows the users to read the DataSource and perform add/edit/delete the data in datasource at runtime.

DataSourceSettings Configures data source for Diagram to create the connection by using ID and parent name as per given data.

Decorator A connector's start and end points can be decorated with some customizable shapes like arrows, circles, diamond, or path.

DefaultSettings Default values for all nodes and connectors can be set using the defaultSettings property.

DiagramIcon Defines or customize the expand/collapse icons appearances for the node.

DiagramPoint

DiagramRuler To customize the appearance of the ruler in diagram.

EnumMember

FlowShape It is used to represent the process flow. It is used for analyzing, designing, and managing for documentation process.

Gesture Defines a combination of keys and key modifiers, on recognition of which the command will be executed

Gradient Gradient allows you to define and apply the gradient effect to the node.

GridLines Gridlines are the pattern of lines drawn behind the diagram elements. It provides a visual guidance while dragging or arranging the objects on the diagram surface.

Group Group is used to cluster multiple nodes and connectors into a single element. It acts like a container for its children (nodes, groups, and connectors).

Header Defines the header of the swimlane nodes in the diagram.

HistoryManager The actions can be recorded into the history manager, such that the undo and redo operations can be performed.

HtmlNode HTML elements can be embedded in the Diagram through the HTML type node. To create an HTML node, set the type of node as “html”.

ImageNode Diagram allows you to add images as image nodes. For image nodes, the type should be set as “image”.

Label Label is a block of text that can be displayed over shapes. Label is used to textually represent an object with a string that can be edited at run time.

LabelMargin It is an absolute value used to add some blank space in any one of its four sides.

Lane Lane is a functional unit or a responsible department of a business process that helps to map a process within the functional unit or in between other functional units.

Layer It is used to organize related shapes on the Diagram control.A layer is a named category of shapes.

Layout Automatically arranges the nodes and connectors in a predefined manner.

Line The path of the connector is defined with a collection of segments. It is used to define whether the connector segment type is straight, orthogonal, or Bezier.

LinearGradient Defines a smooth transition between a set of colors (so-called “stops”) on a line.

NativeNode It provides support to embed SVG element into a node. To create a native node, the type node should be set as “native”.

Node Nodes are graphical objects used to visually represent the geometrical information, process flow, internal business procedure, entity, or any other kind of data.

NodeBase Implements a abstract class of node

Padding Sets the padding for diagram functionalities like nodes, labels, models, rulers, and more.

PageSettings Defines the size and appearance of diagram page.

PaletteItem Used to define size and preview size of the node to add or remove that symbol from the palette.

Phase Phases are the sub-processes that are used to break the swimlane into multiple smaller regions.

Port Essential Diagram for JS provides support to define custom ports for making connections.

RadialGradient Defines a smooth transition between stops on a circle.

Rectangle

RulerSettings Customizes the visibility and appearance of the horizontal and vertical rulers in the diagram.

ScrollableArea Defines a scrollable area bounds within the diagram.

ScrollSettings

Segment The path of the connector is defined with a collection of segments.

SelectedItems

SerializationSettings

Shadow

Shape

SnapSettings The model’s snapSettings property is used to customize the gridlines and control the snapping behavior in the diagram.

Stop The stop class for gradient

SwimLane Typically used to visualize the relationship between a business process and the department responsible for it by focusing on the logical relationships between activities.

TextBlock Defines the textBlock object that is used to define the text to be added and customize the appearance of that text.

TextNode Text can be added to the diagram as text nodes. For text nodes, the type should be set as “text”.

Tooltip Diagram provides tooltip support while dragging, resizing, rotating a node, and when mouse hovers any Diagram element.

UMLActivityShape UMLActivity is used to define the shape of Activity flow shapes to connector. UMLActivity is applicable only for ActivityFlow shapes.

UMLAttribute

UMLClass

UMLClassifier

UMLClassifierMultiplicity

UMLConnectorShape

UMLEnumeration

UMLInterface

UMLLabel

UMLMethod

UMLParameter

Vector