An alternative GraphModelManager implementation that supports WebGL2 for rendering and animating the graph's nodes, edges, and labels.
Inheritance Hierarchy
Remarks
This implementation offers a limited range of visualization customizations but allows for rendering very large graph instances at high frame rates. While we do recommend the standard rendering approach and the default GraphModelManager implementation for the majority of cases, if you must display several thousands or millions of elements on the screen, this implementation will help you keep the performance at highest levels.
To use this feature, create an instance of this class and set it to the graphModelManager property. Note that not all features of IGraph are supported by this implementation. Most notably, IPortStyles will not be considered and thus ports will not be rendered, and graphs with edges at edges cannot be used.
This implementation uses a IRenderTreeElement for the rendering of the graph items. Nevertheless, the rendering order (z-ordering) of the graph item types is defined by the ordering of their corresponding canvas object groups, and can be changed by reordering these groups (groupNodeGroup, edgeGroup, nodeGroup, edgeLabelGroup, and nodeLabelGroup). The values of the HierarchicalNestingPolicy and LabelLayerPolicy properties have no effect.
While the default renderMode is WEBGL, it may be switched to SVG. As soon as this property is set the first time, this WebGLGraphModelManager is prepared for SVG as well as WebGL rendering. This allows to switch fast and mostly seamless between both rendering modes.
See Also
Developer's Guide
Members
Show:
Constructors
Creates a new instance of the WebGLGraphModelManager class.
Creates a new instance of the WebGLGraphModelManager class.
In contrast to the base class, this constructor does not have any parameters. The instance will be configured when it is set to a graphModelManager property. This will trigger configuration automatically via the install method. If you are not using this class via the property, call the life-cycle methods, manually.
When the RenderMode option argument is used, this WebGLGraphModelManager is prepared for Svg as well as WebGL rendering, so switching between those modes will be smoother.
Parameters
See Also
Properties
Gets the currently installed in CanvasComponent.
Gets the currently installed in CanvasComponent.
null when not currently installed.protectedreadonlyfinal
See Also
API
- install
Defined in
GraphModelManager.canvasComponentGets the content group this manager instance uses to add visual representation of the graph to.
Gets the content group this manager instance uses to add visual representation of the graph to.
readonlyfinal
Defined in
GraphModelManager.contentGroupGets the IRenderTreeGroup instance that will be used for installing edge styles.
Gets the IRenderTreeGroup instance that will be used for installing edge styles.
If the field has not yet been initialized upon first access, the factory method createEdgeGroup will be called.
Note that in the case of hierarchically nested graphs, the main render tree elements of edges will only be put directly in this IRenderTreeGroup, if the property is not set to NODES_AND_EDGES. Otherwise, they will actually be nested in the subtree of the nodeGroup according to the node nesting.
readonlyfinal
See Also
Developer's Guide
API
- getEdgeRenderTreeGroup, edgeRenderer
Defined in
GraphModelManager.edgeGroupGets the IRenderTreeGroup instance that will be used for installing edge label styles.
Gets the IRenderTreeGroup instance that will be used for installing edge label styles.
If the field has not yet been initialized upon first access, the factory method createEdgeLabelGroup will be called.
readonlyfinal
See Also
Developer's Guide
API
- getLabelRenderTreeGroup, edgeLabelRenderer
Defined in
GraphModelManager.edgeLabelGroupGets or sets the policy to determine at which visual layer edge labels shall be inserted.
Gets or sets the policy to determine at which visual layer edge labels shall be inserted.
The default value is SEPARATE_LAYER.
conversionfinal
Defined in
GraphModelManager.edgeLabelLayerPolicyProvides access to the ItemModelManager<T> which handles the ILabels at edges.
Provides access to the ItemModelManager<T> which handles the ILabels at edges.
The manager is created by createEdgeLabelModelManager upon first access.
readonlyfinal
Defined in
GraphModelManager.edgeLabelManagerGets or sets the IObjectRenderer<ILabel> instance used for installing an ILabel of an IEdge into the canvas.
Gets or sets the IObjectRenderer<ILabel> instance used for installing an ILabel of an IEdge into the canvas.
final
Defined in
GraphModelManager.edgeLabelRendererProvides access to the ItemModelManager<T> which handles the IEdges.
Provides access to the ItemModelManager<T> which handles the IEdges.
The manager is created by createEdgeModelManager upon first access.
readonlyfinal
Defined in
GraphModelManager.edgeManagerGets or sets the IObjectRenderer<IEdge> instance used for installing an IEdge into the canvas.
Gets or sets the IObjectRenderer<IEdge> instance used for installing an IEdge into the canvas.
final
Defined in
GraphModelManager.edgeRendererGets or sets the graph this manager manages.
Gets or sets the graph this manager manages.
Gets the IRenderTreeGroup instance that will be used for installing node styles of group nodes.
Gets the IRenderTreeGroup instance that will be used for installing node styles of group nodes.
If the field has not yet been initialized upon first access, the factory method createGroupNodeGroup will be called. Note that this group is only used when hierarchicalNestingPolicy is GROUP_NODES.
readonlyfinal
See Also
Developer's Guide
API
- getNodeRenderTreeGroup, nodeRenderer, hierarchicalNestingPolicy
Defined in
GraphModelManager.groupNodeGroupGets or sets the policy whether and how this instance should nest the nodes and edges if the graph is grouped.
Gets or sets the policy whether and how this instance should nest the nodes and edges if the graph is grouped.
Gets a IHitTester that can be used to enumerate hits on the canvas at a given world coordinate position.
Gets a IHitTester that can be used to enumerate hits on the canvas at a given world coordinate position.
This enumerator will enumerate hits in the order so that the visually topmost element will be reported first.
readonlyfinal
Defined in
GraphModelManager.hitTesterGets the IRenderTreeGroup instance that will be used for installing node styles.
Gets the IRenderTreeGroup instance that will be used for installing node styles.
If the field has not yet been initialized upon first access, the factory method createNodeGroup will be called.
Note that the content of this group depends on the hierarchicalNestingPolicy:
- NONE – Contains the main render tree elements of all nodes top-level.
- NODES – Contains the main render tree elements of all nodes in a more complicated nesting of dynamically created IRenderTreeGroups.
- NODES_AND_EDGES – Contains the main render tree elements of all nodes and edges in a more complicated nesting of dynamically created IRenderTreeGroup s.
- GROUP_NODES – Contains the main render tree elements of all leaf nodes. Group nodes having the same hierarchical depth are in one child IRenderTreeGroup of the groupNodeGroup instead.
readonlyfinal
See Also
Developer's Guide
API
- getNodeRenderTreeGroup, getMainRenderTreeElement, nodeRenderer
Defined in
GraphModelManager.nodeGroupGets the IRenderTreeGroup instance that will be used for installing node label styles.
Gets the IRenderTreeGroup instance that will be used for installing node label styles.
If the field has not yet been initialized upon first access, the factory method createNodeLabelGroup will be called.
readonlyfinal
See Also
Developer's Guide
API
- getLabelRenderTreeGroup, nodeLabelRenderer
Defined in
GraphModelManager.nodeLabelGroupGets or sets the policy to determine at which visual layer node labels shall be inserted.
Gets or sets the policy to determine at which visual layer node labels shall be inserted.
The default value is SEPARATE_LAYER.
conversionfinal
Defined in
GraphModelManager.nodeLabelLayerPolicyProvides access to the ItemModelManager<T> which handles the ILabels at nodes.
Provides access to the ItemModelManager<T> which handles the ILabels at nodes.
The manager is created by createNodeLabelModelManager upon first access.
readonlyfinal
Defined in
GraphModelManager.nodeLabelManagerGets or sets the IObjectRenderer<ILabel> instance used for installing an ILabel of an INode into the canvas.
Gets or sets the IObjectRenderer<ILabel> instance used for installing an ILabel of an INode into the canvas.
final
Defined in
GraphModelManager.nodeLabelRendererProvides access to the ItemModelManager<T> which handles the INodes.
Provides access to the ItemModelManager<T> which handles the INodes.
The manager is created by createNodeModelManager upon first access.
readonlyfinal
Defined in
GraphModelManager.nodeManagerGets or sets the IObjectRenderer<INode> instance used for installing an INode into the canvas.
Gets or sets the IObjectRenderer<INode> instance used for installing an INode into the canvas.
final
Defined in
GraphModelManager.nodeRendererGets the IRenderTreeGroup instance that will be used for installing port styles.
Gets the IRenderTreeGroup instance that will be used for installing port styles.
If the field has not yet been initialized upon first access, the factory method createPortGroup will be called.
readonlyfinal
See Also
Developer's Guide
API
- getPortRenderTreeGroup, portRenderer
Defined in
GraphModelManager.portGroupGets the IRenderTreeGroup instance that will be used for installing port label styles.
Gets the IRenderTreeGroup instance that will be used for installing port label styles.
If the field has not yet been initialized upon first access, the factory method createPortLabelGroup will be called.
readonlyfinal
See Also
Developer's Guide
API
- getLabelRenderTreeGroup, portLabelRenderer
Defined in
GraphModelManager.portLabelGroupGets or sets the policy to determine at which visual layer port labels shall be inserted.
Gets or sets the policy to determine at which visual layer port labels shall be inserted.
The default value is SEPARATE_LAYER.
conversionfinal
Defined in
GraphModelManager.portLabelLayerPolicyProvides access to the ItemModelManager<T> which handles the ILabels at ports.
Provides access to the ItemModelManager<T> which handles the ILabels at ports.
The manager is created by createPortLabelModelManager upon first access.
readonlyfinal
Defined in
GraphModelManager.portLabelManagerGets or sets the IObjectRenderer<ILabel> instance used for installing an ILabel of an IPort into the canvas.
Gets or sets the IObjectRenderer<ILabel> instance used for installing an ILabel of an IPort into the canvas.
final
Defined in
GraphModelManager.portLabelRendererGets or sets the policy to determine at which visual layer node and edge ports shall be inserted.
Gets or sets the policy to determine at which visual layer node and edge ports shall be inserted.
The default value is SEPARATE_LAYER.
conversionfinal
Defined in
GraphModelManager.portLayerPolicyProvides access to the ItemModelManager<T> which handles the IPorts.
Provides access to the ItemModelManager<T> which handles the IPorts.
The manager is created by createPortModelManager upon first access.
readonlyfinal
Defined in
GraphModelManager.portManagerGets or sets the IObjectRenderer<IPort> instance used for installing an IPort into the canvas.
Gets or sets the IObjectRenderer<IPort> instance used for installing an IPort into the canvas.
final
Defined in
GraphModelManager.portRendererGets or sets the technology used to render the graph elements.
Gets or sets the technology used to render the graph elements.
As soon as this property is set the first time, this WebGLGraphModelManager is prepared for SVG as well as WebGL rendering, so switching between those modes will be smoother.
The default value is WEBGL.
conversionfinal
Gets an comparison instance that can be used to compare two model items with respect to their visual display order.
Gets an comparison instance that can be used to compare two model items with respect to their visual display order.
An item is considered to be greater than another item if it is rendered on top of it.
readonlyfinal
Defined in
GraphModelManager.renderOrderComparatorMethods
Compares two items with respect to their rendering order.
Compares two items with respect to their rendering order.
Parameters
- item1: IModelItem
- the first item to compare
- item2: IModelItem
- the second item to compare
Return Value
- number
- 0 if item1 == item2, > 0 if item1 is rendered behind item2, < 0 if item1 is rendered in front of item2. Items that are not part of the visualization are always considered to be rendered first.
See Also
Defined in
GraphModelManager.compareRenderOrderCreates an animation that animates the height of a WebGLArcEdgeStyle and WebGLBridgeEdgeStyle.
Creates an animation that animates the height of a WebGLArcEdgeStyle and WebGLBridgeEdgeStyle.
The default height animation starts each iteration with a straight line and then increases the height of the arc or bridge until the original height is reached.
Animations should be shared and un-assigned when not in use as the maximum number of assigned animations is limited to 15 per type of element. There can be only 8 animations assigned to one element at the same time and only 31 different combinations of animations may be assigned to the items.
final
Parameters
- timing?: WebGLAnimationTiming
- Specifies the timing function to use for the animation. Defaults to "1s linear 1 normal". The animation will loop once for one second with a linear progress in normal direction.
Return Value
- WebGLAnimation
- An animation to assign to edges.
See Also
createBeaconAnimation
(pulseWidth?: numberpulseCount?: numberpulseDistance?: numbermagnitude?: numbersmooth?: booleanuseViewCoordinates?: boolean): WebGLAnimationCreates a beacon effect around nodes and edges.
createBeaconAnimation
(pulseWidth?: number
pulseCount?: number
pulseDistance?: number
magnitude?: number
smooth?: boolean
useViewCoordinates?: boolean
): WebGLAnimationCreates a beacon effect around nodes and edges.
Concentric rings around the outline of the node will move outwards away from the node to a given distance. Both the color, the size, the number, the distance between rings, and the duration, as well the number of iterations can be specified. Also whether rings should fade can be determined and in which direction the animation should be played.
Only one beacon or halo animation per element is shown at the same time.
Animations should be shared and un-assigned when not in use as the maximum number of assigned animations is limited to 15 per type of element. There can be only 8 animations assigned to one element at the same time and only 31 different combinations of animations may be assigned to the items.
final
Parameters
- type?: WebGLBeaconAnimationType
- The type of beacon to apply. Defaults to FADE.
- color?: Color
- The color of the beacon. Defaults to black if not specified.
- pulseWidth?: number
- The thickness of a single beacon pulse. Defaults to 4 pixels.
- pulseCount?: number
- How many beacon pulses should be simultaneously visible. Defaults to 1.
- pulseDistance?: number
- The distance between multiple beacon pulses. Defaults to 20 pixels.
- magnitude?: number
- The distance the beacon extends to. Defaults to 50.
- smooth?: boolean
- Whether to draw each pulse smoothly or with hard edges. Defaults to
true. - useViewCoordinates?: boolean
- Whether to render the effect in view coordinates, invariant of the zoom level. Defaults to
false. - timing?: WebGLAnimationTiming
- Specifies the timing function to use for the animation. Defaults to "1s linear 1 normal". The animation will loop once for one second with a linear progress in normal direction.
Return Value
- WebGLAnimation
- An animation to assign to nodes
See Also
Creates an animation that animates the dash pattern of a WebGLPolylineEdgeStyle, WebGLArcEdgeStyle, and WebGLBridgeEdgeStyle.
Creates an animation that animates the dash pattern of a WebGLPolylineEdgeStyle, WebGLArcEdgeStyle, and WebGLBridgeEdgeStyle.
Animations should be shared and un-assigned when not in use as the maximum number of assigned animations is limited to 15 per type of element. There can be only 8 animations assigned to one element at the same time and only 31 different combinations of animations may be assigned to the items.
final
Parameters
- extent?: number
- The extent of the animation in dash lengths. Defaults to 1.
- timing?: WebGLAnimationTiming
- Specifies the timing function to use for the animation. Defaults to "1s linear 1 normal". The animation will loop once for one second with a linear progress in normal direction.
Return Value
- WebGLAnimation
- An animation to assign to edges.
See Also
Factory method for the edgeGroup property.
Factory method for the edgeGroup property.
This method will be called upon first access to the property.
protected
Return Value
- IRenderTreeGroup
- a new group that has been added to the contentGroup
Defined in
GraphModelManager.createEdgeGroupFactory method for the edgeLabelGroup property.
Factory method for the edgeLabelGroup property.
This method will be called upon first access to the property.
protected
Return Value
- IRenderTreeGroup
- a new group that has been added to the contentGroup
Defined in
GraphModelManager.createEdgeLabelGroupcreateEdgeLabelModelManager
(renderer: IObjectRenderer<ILabel>, callback: function(ILabel): IRenderTreeGroup): ItemModelManager<ILabel>protectedFactory method for creating the ItemModelManager<T> that handles the visual representation of edge labels.
createEdgeLabelModelManager
(renderer: IObjectRenderer<ILabel>, callback: function(ILabel): IRenderTreeGroup): ItemModelManager<ILabel>protected
Factory method for creating the ItemModelManager<T> that handles the visual representation of edge labels.
protected
Parameters
- renderer: IObjectRenderer<ILabel>
- An IObjectRenderer<ILabel> for edge labels.
- callback: function(ILabel): IRenderTreeGroup
- A callback to get the IRenderTreeGroup containing the render tree element of a given edge label.
Return Value
- ItemModelManager<ILabel>
- a new instance of ItemModelManager<T> for edge labels
createEdgeModelManager
(renderer: IObjectRenderer<IEdge>, callback: function(IEdge): IRenderTreeGroup): ItemModelManager<IEdge>protectedFactory method for creating the ItemModelManager<T> that handles the visual representation of edges.
createEdgeModelManager
(renderer: IObjectRenderer<IEdge>, callback: function(IEdge): IRenderTreeGroup): ItemModelManager<IEdge>protected
Factory method for creating the ItemModelManager<T> that handles the visual representation of edges.
protected
Parameters
- renderer: IObjectRenderer<IEdge>
- An IObjectRenderer<IEdge> for IEdges.
- callback: function(IEdge): IRenderTreeGroup
- A callback to get the IRenderTreeGroup containing the render tree element of a given edge.
Return Value
- ItemModelManager<IEdge>
- a new instance of ItemModelManager<T> for edges
Defined in
GraphModelManager.createEdgeModelManagerCreates an animation that fades the colors of item effects like AMBIENT_FILL_COLOR.
Creates an animation that fades the colors of item effects like AMBIENT_FILL_COLOR.
Animations should be shared and un-assigned when not in use as the maximum number of assigned animations is limited to 15 per type of element. There can be only 8 animations assigned to one element at the same time and only 31 different combinations of animations may be assigned to the items.
final
Parameters
- type: WebGLFadeAnimationType
- The type of fading to apply.
- color1?: Color
- The first color to fade to when choosing mode FADE_TO_COLOR. This color will be applied to the white regions of a grayscale representation of the node effect.
- color2?: Color
- The second color to fade to when choosing mode FADE_TO_COLOR. This color will be applied to the black regions of a grayscale representation of the node effect.
- timing?: WebGLAnimationTiming
- Specifies the timing function to use for the animation. Defaults to "1s linear 1 normal". The animation will loop once for one second with a linear progress in normal direction.
Return Value
- WebGLAnimation
- An animation to assign to nodes, edges, or labels
See Also
Creates an animation that applies a pulsating effect to item effects like AMBIENT_FILL_COLOR .
Creates an animation that applies a pulsating effect to item effects like AMBIENT_FILL_COLOR .
Animations should be shared and un-assigned when not in use as the maximum number of assigned animations is limited to 15 per type of element. There can be only 8 animations assigned to one element at the same time and only 31 different combinations of animations may be assigned to the items.
final
Parameters
- type?: WebGLPulseAnimationType
- The type of the pulse to apply. Defaults to GROW.
- amount?: number
- The extent of the pulses. Defaults to 2. Note that the amount has to be compatible with the type. For example, negative numbers have no effect when used on GROW_RELATIVE
- useViewCoordinates?: boolean
- Whether the extent of the animation is zoom-invariant for zoom values below 1.
- timing?: WebGLAnimationTiming
- Specifies the timing function to use for the animation. Defaults to "1s linear 1 normal". The animation will loop once for one second with a linear progress in normal direction. EASE, EASE_IN, EASE_OUT, and EASE_IN_OUT are interpreted the same and have the effect that the wave form is eased at its extremes (creating a sine-like wave form). STEP creates a rectangular wave form.
Return Value
- WebGLAnimation
- An animation to assign to node effects.
See Also
Creates an animation that applies a scaling effect to item effects.
Creates an animation that applies a scaling effect to item effects.
Animations should be shared and un-assigned when not in use as the maximum number of assigned animations is limited to 15 per type of element. There can be only 8 animations assigned to one element at the same time and only 31 different combinations of animations may be assigned to the items.
final
Parameters
- type?: WebGLScaleAnimationType
- The type of the scale to apply. Defaults to GROW.
- amount?: number
- The extent of the scale. Defaults to 5. For relative WebGLScaleAnimationTypes this is the scaling factor.
- useViewCoordinates?: boolean
- Whether the extent of the animation is zoom-invariant for zoom values below 1.
- timing?: WebGLAnimationTiming
- Specifies the timing function to use for the animation. Defaults to "1s linear 1 normal". The animation will loop once for one second with a linear progress in normal direction. Defaults to NORMAL.
Return Value
- WebGLAnimation
- An animation to assign to nodes effects
See Also
Creates an animation that fades the colors of nodes, edges, or labels.
Creates an animation that fades the colors of nodes, edges, or labels.
Animations should be shared and un-assigned when not in use as the maximum number of assigned animations is limited to 15 per type of element. There can be only 8 animations assigned to one element at the same time and only 31 different combinations of animations may be assigned to the items.
final
Parameters
- type: WebGLFadeAnimationType
- The type of fading to apply.
- color1?: Color
- The first color to fade to when choosing mode FADE_TO_COLOR. This color will be applied to the white regions of a grayscale representation of an item.
- color2?: Color
- The second color to fade to when choosing mode FADE_TO_COLOR. This color will be applied to the black regions of a grayscale representation of an item.
- timing?: WebGLAnimationTiming
- Specifies the timing function to use for the animation. Defaults to "1s linear 1 normal". The animation will loop once for one second with a linear progress in normal direction.
Return Value
- WebGLAnimation
- An animation to assign to nodes, edges, or labels
See Also
Factory method for the groupNodeGroup property.
Factory method for the groupNodeGroup property.
This method will be called upon first access to the property.
protected
Return Value
- IRenderTreeGroup
- a new group that has been added to the contentGroup
Defined in
GraphModelManager.createGroupNodeGroupCreates a solid halo effect around nodes.
Creates a solid halo effect around nodes.
A solid ring around the outline of the node will grow away from the node to a given maximum magnitude. Both the color and magnitude, as well the timing function may be specified.
Only one halo or beacon animation per element is shown at the same time.
Animations should be shared and un-assigned when not in use as the maximum number of assigned animations is limited to 15 per type of element. There can be only 8 animations assigned to one element at the same time and only 31 different combinations of animations may be assigned to the items.
final
Parameters
- color?: Color
- The color of the halo. Defaults to semi-transparent 50% gray if not specified.
- magnitude?: number
- The distance the halo extends away from the shape. Defaults to 50.
- useViewCoordinates?: boolean
- Whether to render the effect in view coordinates, invariant of the zoom level. Defaults to
false. - timing?: WebGLAnimationTiming
- Specifies the timing function to use for the animation. Defaults to "1s linear 1 normal". The animation will loop once for one second with a linear progress in normal direction.
Return Value
- WebGLAnimation
- An animation to assign to nodes
See Also
Factory method for the nodeGroup property.
Factory method for the nodeGroup property.
This method will be called upon first access to the property.
protected
Return Value
- IRenderTreeGroup
- a new group that has been added to the contentGroup
Defined in
GraphModelManager.createNodeGroupFactory method for the nodeLabelGroup property.
Factory method for the nodeLabelGroup property.
This method will be called upon first access to the property.
protected
Return Value
- IRenderTreeGroup
- a new group that has been added to the contentGroup
Defined in
GraphModelManager.createNodeLabelGroupcreateNodeLabelModelManager
(renderer: IObjectRenderer<ILabel>, callback: function(ILabel): IRenderTreeGroup): ItemModelManager<ILabel>protectedFactory method for creating the ItemModelManager<T> that handles the visual representation of node labels.
createNodeLabelModelManager
(renderer: IObjectRenderer<ILabel>, callback: function(ILabel): IRenderTreeGroup): ItemModelManager<ILabel>protected
Factory method for creating the ItemModelManager<T> that handles the visual representation of node labels.
protected
Parameters
- renderer: IObjectRenderer<ILabel>
- An IObjectRenderer<ILabel> for node labels.
- callback: function(ILabel): IRenderTreeGroup
- A callback to get the IRenderTreeGroup containing the render tree element of a given node label.
Return Value
- ItemModelManager<ILabel>
- a new instance of ItemModelManager<T> for node labels
createNodeModelManager
(renderer: IObjectRenderer<INode>, callback: function(INode): IRenderTreeGroup): ItemModelManager<INode>protectedFactory method for creating the ItemModelManager<T> that handles the visual representation of nodes.
createNodeModelManager
(renderer: IObjectRenderer<INode>, callback: function(INode): IRenderTreeGroup): ItemModelManager<INode>protected
Factory method for creating the ItemModelManager<T> that handles the visual representation of nodes.
protected
Parameters
- renderer: IObjectRenderer<INode>
- An IObjectRenderer<INode> for INodes.
- callback: function(INode): IRenderTreeGroup
- A callback to get the IRenderTreeGroup containing the render tree element of a given node.
Return Value
- ItemModelManager<INode>
- a new instance of ItemModelManager<T> for nodes
Defined in
GraphModelManager.createNodeModelManagerFactory method for the portGroup property.
Factory method for the portGroup property.
This method will be called upon first access to the property.
protected
Return Value
- IRenderTreeGroup
- a new group that has been added to the contentGroup
Defined in
GraphModelManager.createPortGroupFactory method for the portLabelGroup property.
Factory method for the portLabelGroup property.
This method will be called upon first access to the property.
protected
Return Value
- IRenderTreeGroup
- a new group that has been added to the contentGroup
Defined in
GraphModelManager.createPortLabelGroupcreatePortLabelModelManager
(renderer: IObjectRenderer<ILabel>, callback: function(ILabel): IRenderTreeGroup): ItemModelManager<ILabel>protectedFactory method for creating the ItemModelManager<T> that handles the visual representation of port labels.
createPortLabelModelManager
(renderer: IObjectRenderer<ILabel>, callback: function(ILabel): IRenderTreeGroup): ItemModelManager<ILabel>protected
Factory method for creating the ItemModelManager<T> that handles the visual representation of port labels.
protected
Parameters
- renderer: IObjectRenderer<ILabel>
- An IObjectRenderer<ILabel> for port labels.
- callback: function(ILabel): IRenderTreeGroup
- A callback to get the IRenderTreeGroup containing the render tree element of a given port label.
Return Value
- ItemModelManager<ILabel>
- a new instance of ItemModelManager<T> for port labels
createPortModelManager
(renderer: IObjectRenderer<IPort>, callback: function(IPort): IRenderTreeGroup): ItemModelManager<IPort>protectedFactory method for creating the ItemModelManager<T> that handles the visual representation of ports.
createPortModelManager
(renderer: IObjectRenderer<IPort>, callback: function(IPort): IRenderTreeGroup): ItemModelManager<IPort>protected
Factory method for creating the ItemModelManager<T> that handles the visual representation of ports.
protected
Parameters
- renderer: IObjectRenderer<IPort>
- An IObjectRenderer<IPort> for IPorts.
- callback: function(IPort): IRenderTreeGroup
- A callback to get the IRenderTreeGroup containing the render tree element of a given port.
Return Value
- ItemModelManager<IPort>
- a new instance of ItemModelManager<T> for ports
Defined in
GraphModelManager.createPortModelManagerCreates an animation that applies a pulsating effect to nodes, labels, or edges.
Creates an animation that applies a pulsating effect to nodes, labels, or edges.
Animations should be shared and un-assigned when not in use as the maximum number of assigned animations is limited to 15 per type of element. There can be only 8 animations assigned to one element at the same time and only 31 different combinations of animations may be assigned to the items.
final
Parameters
- type?: WebGLPulseAnimationType
- The type of the pulse to apply. Defaults to GROW.
- amount?: number
- The extent of the pulses. Defaults to 2. Note that the amount has to be compatible with the type. For example, negative numbers have no effect when used on GROW_RELATIVE
- useViewCoordinates?: boolean
- Whether the extent of the animation is zoom-invariant for zoom values below 1.
- timing?: WebGLAnimationTiming
- Specifies the timing function to use for the animation. Defaults to "1s linear 1 normal". The animation will loop once for one second with a linear progress in normal direction.
Return Value
- WebGLAnimation
- An animation to assign to nodes, edges, or labels
See Also
Creates an animation that applies a scaling effect to nodes, edges, or labels.
Creates an animation that applies a scaling effect to nodes, edges, or labels.
Animations should be shared and un-assigned when not in use as the maximum number of assigned animations is limited to 15 per type of element. There can be only 8 animations assigned to one element at the same time and only 31 different combinations of animations may be assigned to the items.
final
Parameters
- type?: WebGLScaleAnimationType
- The type of the scale to apply. Defaults to GROW.
- amount?: number
- The extent of the scale. Defaults to 5. For relative WebGLScaleAnimationTypes this is the scaling factor.
- useViewCoordinates?: boolean
- Whether the extent of the animation is zoom-invariant for zoom values below 1.
- timing?: WebGLAnimationTiming
- Specifies the timing function to use for the animation. Defaults to "1s linear 1 normal". The animation will loop once for one second with a linear progress in normal direction.
Return Value
- WebGLAnimation
- An animation to assign to nodes, edges, or labels
See Also
Creates an animation that applies a shake effect to nodes, edges, or labels.
Creates an animation that applies a shake effect to nodes, edges, or labels.
Animations should be shared and un-assigned when not in use as the maximum number of assigned animations is limited to 15 per type of element. There can be only 8 animations assigned to one element at the same time and only 31 different combinations of animations may be assigned to the items.
final
Parameters
- type: WebGLShakeAnimationType
- The type of shake to apply.
- magnitude?: number
- The distance the shake moves an item. Defaults to 2.
- useViewCoordinates?: boolean
- Whether the extent of the animation is zoom-invariant for zoom values below 1.
- timing?: WebGLAnimationTiming
- Specifies the timing function to use for the animation. Defaults to "1s linear 1 normal". The animation will loop once for one second with a linear progress in normal direction. EASE, EASE_IN, EASE_OUT, and EASE_IN_OUT are interpreted the same and have the effect that the wave form is eased at its extremes (creating a sine-like wave form). STEP creates a rectangular wave form.
Return Value
- WebGLAnimation
- An animation to assign to nodes, edges, or labels
See Also
Returns the currently associated animations for the given item.
Returns the currently associated animations for the given item.
final
Parameters
- item: IModelItem
- This should be a node, edge, or label, currently managed and rendered by this instance.
Return Value
- WebGLAnimation
- A copy of a possibly empty array of all the animations currently in effect for the provided item.
Throws
- Exception ({ name: 'NotSupportedError' })
- If this instance is not associated with a graph via a component.
Retrieves the IRenderTreeGroup containing the render tree element of a given edge.
Retrieves the IRenderTreeGroup containing the render tree element of a given edge.
This implementation is called by the default edgeRenderer instance.
protected
Parameters
- edge: IEdge
- The edge that will be installed in the canvas.
Return Value
- IRenderTreeGroup
- The group to use.
Defined in
GraphModelManager.getEdgeRenderTreeGroupRetrieves the IRenderTreeGroup containing the render tree element of a given label.
Retrieves the IRenderTreeGroup containing the render tree element of a given label.
This implementation is called by the default nodeLabelRenderer, edgeLabelRenderer, and portLabelRenderer instances.
protected
Parameters
- label: ILabel
- The label that will be installed in the canvas.
Return Value
- IRenderTreeGroup
- The group to use.
Retrieves the IRenderTreeElement for a given model item that can be used for z-order or visibility operations.
Retrieves the IRenderTreeElement for a given model item that can be used for z-order or visibility operations.
The z-order can be changed on the returned IRenderTreeElement via raise, lower, toFront, toBack, above or below.
The visibility can be changed via the visible property.
Note that these z-order or visibility changes will also affect model items whose z-order directly depends on item like labels if AT_OWNER is chosen.
Parameters
- item: IModelItem
- the item
Return Value
- IRenderTreeElement
- The main render tree element for the given item or
null
See Also
Developer's Guide
API
- getRenderTreeElement
Retrieves the corresponding IModelItem for the given render tree element.
Retrieves the corresponding IModelItem for the given render tree element.
Parameters
- renderTreeElement: IRenderTreeElement
- The instance to use for the query
Return Value
- IModelItem
- The item that is associated with the render tree element or
null.
Defined in
GraphModelManager.getModelItemRetrieves the IRenderTreeGroup containing the render tree element of a given node.
Retrieves the IRenderTreeGroup containing the render tree element of a given node.
This implementation is called by the default nodeRenderer instance.
protected
Parameters
- node: INode
- The node that will be installed in the canvas.
Return Value
- IRenderTreeGroup
- The group to use.
See Also
Developer's Guide
Defined in
GraphModelManager.getNodeRenderTreeGroupRetrieves the IRenderTreeGroup containing the render tree element of a given port.
Retrieves the IRenderTreeGroup containing the render tree element of a given port.
This implementation is called by the default portRenderer instance.
protected
Parameters
- port: IPort
- The port that will be installed in the canvas.
Return Value
- IRenderTreeGroup
- The group to use.
Defined in
GraphModelManager.getPortRenderTreeGroupRetrieves the IRenderTreeElement visualizing a given model item managed by this instance.
Retrieves the IRenderTreeElement visualizing a given model item managed by this instance.
Note that for changing the z-order via raise, lower, toFront, toBack, above or below or for switching the visibility the main render tree element should be used instead.
Parameters
- item: IModelItem
- the item
Return Value
- IRenderTreeElement
- the render tree element for the given item or
null
See Also
Defined in
GraphModelManager.getRenderTreeElementReturns the currently associated style to use for the edge when rendered in WebGL mode.
Returns the currently associated style to use for the edge when rendered in WebGL mode.
This method may only be called for edges that are currently rendered.
final
Parameters
- edge: IEdge
- The edge to return the style for.
Return Value
- any
- The style that is used for rendering the item.
Throws
Returns the currently associated style to use for the node when rendered in WebGL mode.
Returns the currently associated style to use for the node when rendered in WebGL mode.
This method may only be called for nodes that are currently rendered.
final
Parameters
- node: INode
- The node to return the style for.
Return Value
- any
- The style that is used for rendering the item.
Throws
Returns the currently associated style to use for the label when rendered in WebGL mode.
Returns the currently associated style to use for the label when rendered in WebGL mode.
This method may only be called for labels that are currently rendered.
final
Parameters
- label: ILabel
- The label to return the style for.
Return Value
- any
- The style that is used for rendering the item.
Throws
Gets a WebGL2 edge style that is similar to the IEdgeStyle of the given edge.
Gets a WebGL2 edge style that is similar to the IEdgeStyle of the given
edge.The WebGLGraphModelManager can only render WebGL2-specific edge style instances. This method is used as a callback when an IEdge is added to the graph of this instance. The associated style will be translated to a style that can be rendered by this instance and looks similar.
Note that specifically custom style implementations can benefit from a custom implementation that directly translates style instances to a corresponding WebGL2-based style.
Alternatively to overriding this method, calling getStyle can be used. It is slightly slower, because the initial translation via this method will be performed, either way.
protected
Parameters
Return Value
- any
- A (possibly shared) instance of either a WebGLPolylineEdgeStyles, WebGLArcEdgeStyle, or WebGLBridgeEdgeStyle. Returning
nullwill apply a default style instead.
Gets a WebGL2 label style that is similar to the ILabelStyle of the given label.
Gets a WebGL2 label style that is similar to the ILabelStyle of the given
label.The WebGLGraphModelManager can only render WebGL2-specific label style instances. This method is used as a callback when an ILabel is added to the graph of this instance. The associated style will be translated to a style that can be rendered by this instance and looks similar.
Note that specifically custom style implementations and template-based styles can benefit from a custom implementation that directly translates style instances to a corresponding WebGL2-based style.
Alternatively to overriding this method, calling getStyle can be used. It is slightly slower, because the initial translation via this method will be performed, either way. Also note that an IconLabelStyle is not automatically converted to a corresponding WebGLIconLabelStyle since its icon cannot be converted in synchronous code.
protected
Parameters
Return Value
- any
- A (possibly shared) instance of either a WebGLLabelStyle or WebGLIconLabelStyle. Returning
nullwill apply a default style instead.
See Also
Developer's Guide
Gets a WebGL2 node style that is similar to the INodeStyle of the given node.
Gets a WebGL2 node style that is similar to the INodeStyle of the given
node.The WebGLGraphModelManager can only render WebGL2-specific node style instances. This method is used as a callback when an INode is added to the graph of this instance. The associated style will be translated to a style that can be rendered by this instance and looks similar.
Note that specifically custom style implementations and template-based styles can benefit from a custom implementation that directly translates style instances to a corresponding WebGL2-based style. Also note that an ImageNodeStyle is not automatically converted to a corresponding WebGLImageNodeStyle since its image cannot be converted in synchronous code.
Alternatively to overriding this method, calling getStyle can be used. It is slightly slower, because the initial translation via this method will be performed, either way.
protected
Parameters
Return Value
- any
- A (possibly shared) instance of either a WebGLShapeNodeStyle, WebGLImageNodeStyle, or WebGLGroupNodeStyle. Returning
nullwill apply a default style instead.
See Also
Developer's Guide
Enumerates hits in the render tree of the canvas at a given world coordinate position for a given context and IRenderTreeGroup.
Enumerates hits in the render tree of the canvas at a given world coordinate position for a given context and IRenderTreeGroup.
The instance returned will enumerate hits in the order so that the topmost visual element will be reported first. The enumeration is performed lazily.
Note that if you do not specify the root parameter, only the members of the contentGroup will be hit tested.
Parameters
- location: Point
- the world coordinates to perform the hit test at
- context?: IInputModeContext
- The context to provide to isHit
- root?: IRenderTreeGroup
- The group to search the subtree of. contentGroup if not specified.
- typeFilter?: GraphItemTypes
- An optional filter that preselects a subset of types that will be tested and reported. This can result in improved performance when testing does not need to be performed.
Return Value
- IEnumerable<IModelItem>
- a live enumerable that will enumerate the hits at the given coordinates
Overrides
GraphModelManager.hitElementsAtInstalls this instance for the specified CanvasComponent.
Installs this instance for the specified CanvasComponent.
To use an instance of this class as the main GraphModelManager of a GraphComponent, set it to the graphModelManager property. This will then call this method.
Parameters
- canvasComponent: CanvasComponent
- The CanvasComponent.
- graph: IGraph
- The graph.
- contentGroup?: IRenderTreeGroup
- The group to add the graph's visual content to. If omitted, the contentGroup of the renderTree of the
canvasComponentis used.
Overrides
GraphModelManager.installLowers the visual representation of the item below its current predecessor.
Lowers the visual representation of the
item below its current predecessor.Lowers the main render tree element of the
item below its current predecessor in its containing parent.Parameters
- item: IModelItem
- The model item to lower.
See Also
Developer's Guide
Defined in
GraphModelManager.lowerLowers the visual representations of all IModelItems in items below their current predecessors.
Lowers the visual representations of all IModelItems in
items below their current predecessors.Lowers the main render tree elements of all IModelItems in
items below their current predecessors in their containing parent.Parameters
- items: IEnumerable<IModelItem>
- The IModelItems to lower.
See Also
Developer's Guide
Defined in
GraphModelManager.lowerThis method registers the collections of the graph instance with the mechanism that manages the mapping between the elements and the IRenderTreeElements. Subclasses should call the base method if they want to use the default mechanisms.
protected
Parameters
Overrides
GraphModelManager.onGraphChangedRaises the visual representation of the item above its current successor.
Raises the visual representation of the
item above its current successor.Raises the main render tree element of the
item above its current successor in the containing parent.Parameters
- item: IModelItem
- The model item to raise.
See Also
Developer's Guide
Defined in
GraphModelManager.raiseRaises the visual representations of all IModelItems in items above their current successors.
Raises the visual representations of all IModelItems in
items above their current successors.Raises the main render tree elements of all IModelItems in
items above their current successors in their containing parent.Parameters
- items: IEnumerable<IModelItem>
- The IModelItems to raise.
See Also
Developer's Guide
Defined in
GraphModelManager.raiseSets the animations to apply to the node.
Sets the animations to apply to the node.
final
Parameters
- node: INode
- The node instance to specify the animations for. The node must belong to the displayed graph.
- animations: WebGLAnimation[]
- The animations to apply. Animations may and should be shared among items. Provide
nullor an empty array in order to clear existing animations.
Throws
- Exception ({ name: 'NotSupportedError' })
- If this instance is not associated with a graph via a component.
See Also
Sets the animations to apply to the edge.
Sets the animations to apply to the edge.
final
Parameters
- edge: IEdge
- The edge instance to specify the animations for. The edge must belong to the displayed graph.
- animations: WebGLAnimation[]
- The animations to apply. Animations may and should be shared among items. Provide
nullor an empty array in order to clear existing animations.
Throws
- Exception ({ name: 'NotSupportedError' })
- If this instance is not associated with a graph via a component.
See Also
Sets the animations to apply to the label.
Sets the animations to apply to the label.
final
Parameters
- label: ILabel
- The label instance to specify the animations for. The label must belong to the displayed graph.
- animations: WebGLAnimation[]
- The animations to apply. Animations may and should be shared among items. Provide
nullor an empty array in order to clear existing animations.
Throws
- Exception ({ name: 'NotSupportedError' })
- If this instance is not associated with a graph via a component.
See Also
Lowers the visual representation of the item to the back.
Lowers the visual representation of the
item to the back.Parameters
- item: IModelItem
- The model item to lower to the back.
See Also
Developer's Guide
Defined in
GraphModelManager.toBackLowers the visual representation of all IModelItems in items to the back.
Lowers the visual representation of all IModelItems in
items to the back.Lowers the main render tree elements of all IModelItems in
items to the back in their containing parent.Parameters
- items: IEnumerable<IModelItem>
- The IModelItems to move to the back.
See Also
Developer's Guide
Defined in
GraphModelManager.toBackRaises the visual representation of the item to the front.
Raises the visual representation of the
item to the front.Parameters
- item: IModelItem
- The model item to raise to the front.
See Also
Developer's Guide
Defined in
GraphModelManager.toFrontRaises the visual representations of all IModelItems in items to the front.
Raises the visual representations of all IModelItems in
items to the front.Raises the main render tree elements of all IModelItems in
items to the front in their containing parent.Parameters
- items: IEnumerable<IModelItem>
- The IModelItems to move to the front.
See Also
Developer's Guide
Defined in
GraphModelManager.toFrontReverts the install method.
Reverts the install method.
If another GraphModelManager is set to the GraphComponent's graphModelManager property, this method will be called automatically for the old instance.
Parameters
- canvas: CanvasComponent
- The CanvasComponent.
Overrides
GraphModelManager.uninstallUpdates the visual representation of the given item.
Updates the visual representation of the given item.
Parameters
- item: IModelItem
- The item to update the visual representation of
See Also
API
- update
Defined in
GraphModelManager.updateUpdates the location of the WebGL2 visualization of the given label.
Updates the location of the WebGL2 visualization of the given
label.Graph operations that indirectly affect a label's geometry without setting the layoutParameter property may result in an incorrect rendering location for the label. For performance reasons, we don't continuously update the rendering location when the layout parameter doesn't change. Instead, this method must be called to force an update of the rendering location.
final
Parameters
- label: ILabel
- The label for which the rendering location should be updated.
Explicitly updates the WebGL2 style of a node
Explicitly updates the WebGL2 style of a
nodeIf the WebGL2 style of a node is automatically translated from style, subsequent changes to those INodeStyle instances without setting a new style instance may result in an incorrect rendering for the node. This method forces an explicit update of the WebGL2 node style for these cases.
final
Parameters
- node: INode
- The node for which the WebGL2 style should be updated.
Throws
- Exception ({ name: 'NotSupportedError' })
- If this instance is not associated with a graph via a component.
Explicitly updates the WebGL2 style of an edge
Explicitly updates the WebGL2 style of an
edgeIf the WebGL2 style of an edge is automatically translated from style, subsequent changes to those IEdgeStyle instances without setting a new style instance may result in an incorrect rendering for the edge. This method forces an explicit update of the WebGL2 edge style for these cases.
final
Parameters
- edge: IEdge
- The edge for which the WebGL2 style should be updated.
Throws
- Exception ({ name: 'NotSupportedError' })
- If this instance is not associated with a graph via a component.
Explicitly updates the WebGL2 style of a label
Explicitly updates the WebGL2 style of a
labelIf the WebGL2 style of a label is automatically translated from style, subsequent changes to those ILabelStyle instances without setting a new style instance may result in an incorrect rendering for the label. This method forces an explicit update of the WebGL2 label style for these cases.
final
Parameters
- label: ILabel
- The label for which the WebGL2 style should be updated.
Throws
- Exception ({ name: 'NotSupportedError' })
- If this instance is not associated with a graph via a component.
Events
Occurs when the asynchronous compilation of WebGL2 shaders has finished.
Occurs when the asynchronous compilation of WebGL2 shaders has finished.
Note that this event is only fired when all shaders are done compiling, so that afterward, no shaders are still compiling.
Properties of
EventArgsOccurs when the asynchronous compilation of WebGL2 shaders has started.
Occurs when the asynchronous compilation of WebGL2 shaders has started.
This event can be used to e.g. show a loading indicator while shaders are compiling. Note that this event is not fired when shaders start compiling while another compilation is already running.