Interface: DvtDiagramLayoutContext

Oracle® JavaScript Extension Toolkit (JET)
18.0.0
G12199-01

Since:
  • 3.0
Module:
  • ojdiagram

QuickNav

Methods

Description

Pluggable layout code must conform to the pluggable layout contract. The following steps outline a simple pluggable layout.

  1. Diagram calls layout engine with layout context.
  2. Layout engine loops over nodes using getNodeCount and getNodeByIndex()
    • layout engine gets dimensions of node by calling getBounds()
    • layout engine sets position on node by calling setPosition()
  3. Layout engine loops over links using getLinkCount and getLinkByIndex()
    • layout engine gets start and end nodes by calling getStartId()/getEndId() on a link object
    • layout engine analyzes nodes position and dimensions by calling getPosition() and getBounds() on each node and finds connection points for the link start/end
    • layout engine creates a link path by calling setPoints() on a link object
  4. Diagram applies node positions from layout context

The DvtDiagramLayoutContext interface defines the context for a layout call.


Usage

Signature:

interface DvtDiagramLayoutContext<K1, K2, D1 extends ojDiagram.Node<K1>|any, D2 extends ojDiagram.Link<K2, K1>|any>

Generic Parameters
ParameterDescription
K1Type of key of the nodeData dataprovider
K2Type of key of the linkData dataprovider
D1Type of data from the nodeData dataprovider
D2Type of data from the linkData dataprovider
Typescript Import Format
//To use this interface, import as below.
import {DvtDiagramLayoutContext} from "ojs/ojdiagram";

For additional information visit:


Pluggable layout code must conform to the pluggable layout contract. The following steps outline a simple pluggable layout.

  1. Diagram calls layout engine with layout context.
  2. Layout engine loops over nodes using getNodeCount and getNodeByIndex()
    • layout engine gets dimensions of node by calling getBounds()
    • layout engine sets position on node by calling setPosition()
  3. Layout engine loops over links using getLinkCount and getLinkByIndex()
    • layout engine gets start and end nodes by calling getStartId()/getEndId() on a link object
    • layout engine analyzes nodes position and dimensions by calling getPosition() and getBounds() on each node and finds connection points for the link start/end
    • layout engine creates a link path by calling setPoints() on a link object
  4. Diagram applies node positions from layout context

The DvtDiagramLayoutContext interface defines the context for a layout call.

Methods

getCommonContainer(nodeId1, nodeId2) : {(K1|null)}

The function retrieves nearest common ancestor container for two nodes.
Parameters:
Name Type Description
nodeId1 K1 first node id
nodeId2 K1 second node id
Returns:

Id for the first common ancestor container or null for top level diagram

Type
(K1|null)

getComponentSize : {{x: number, y: number, w: number, h: number}}

Get the size of the Diagram.
Properties:
Name Type Description
h number height
w number width
x number x-coordinate
y number y-coordinate
Returns:

An object containing properties of the diagram size

Type
{x: number, y: number, w: number, h: number}

getCurrentViewport : {{x: number, y: number, w: number, h: number}}

Get the current viewport used by the component in the layout's coordinate system for the diagram
Deprecated:
Since Description
13.0.0 The getCurrentViewportport method has been deprecated, please use the panZoomState object on the component.
Properties:
Name Type Description
h number height
w number width
x number x-coordinate
y number y-coordinate
Returns:

An object containing properties of the current viewport

Type
{x: number, y: number, w: number, h: number}

getEventData : {Object}

Gets event data object. Values can be retrieved from the object using 'type' and 'data' keys.
Deprecated:
Since Description
7.1.0 The function is supported with DiagramDataSource. Use data providers instead.
Properties:
Name Type Description
data Object Event payload object for the event - see EventType for event details.
type string Event type - "add", "remove" or "change".
Since:
  • 4.0.0
Returns:

event data object

Type
Object

getLinkById(id) : {DvtDiagramLayoutContextLink<K1, K2, D2>}

Get a link context by id.
Parameters:
Name Type Description
id K1 id of link context to get
Returns:
Type
DvtDiagramLayoutContextLink<K1, K2, D2>

getLinkByIndex(index) : {DvtDiagramLayoutContextLink<K1, K2, D2>}

Get a link context by index.
Parameters:
Name Type Description
index number index of link context to get
Returns:
Type
DvtDiagramLayoutContextLink<K1, K2, D2>

getLinkCount : {number}

Get the number of links to layout.
Returns:
Type
number

getNodeById(id) : {DvtDiagramLayoutContextNode<K1,D1>}

Get a node context by id.
Parameters:
Name Type Description
id K1 id of node context to get
Returns:
Type
DvtDiagramLayoutContextNode<K1,D1>

getNodeByIndex(index) : {DvtDiagramLayoutContextNode<K1,D1>}

Get a node context by index.
Parameters:
Name Type Description
index number index of node context to get
Returns:
Type
DvtDiagramLayoutContextNode<K1,D1>

getNodeCount : {number}

Get the number of nodes to layout.
Returns:
Type
number

getViewport : {{x: number, y: number, w: number, h: number}}

Get the viewport the component should use after the layout, in the layout's coordinate system.
Deprecated:
Since Description
13.0.0 The getViewport method has been deprecated, please use the panZoomState object on the component.
Properties:
Name Type Description
h number height
w number width
x number x-coordinate
y number y-coordinate
Returns:

An object containing properties of the viewport

Type
{x: number, y: number, w: number, h: number}

isLocaleR2L : {boolean}

Get whether the reading direction for the locale is right-to-left.
Returns:
Type
boolean

setPanZoomState(panZoomState) : {void}

Set the pan/zoom state the component should use after the layout.
Parameters:
Name Type Description
panZoomState { zoom: number | null, centerX: number | null, centerY: number | null} An object containing properties of the panZoomState that the component should use after the layout
Properties:
Name Type Description
centerX number | null The x coordinate of the center of the viewport in the layout coordinate space. If undefined, the content will be centered horizontally.
centerY number | null The y coordinate of the center of the viewport in the layout coordinate space. If undefined, the content will be centered vertically.
zoom number | null Specifies the zoom value of the diagram. The specified value should be between the diagram minZoom and maxZoom values. A value of 0 indicates that the diagram should be zoomed in as much as possible while keeping all content visible.
Returns:
Type
void

setViewport(viewport) : {void}

Set the viewport the component should use after the layout, in the layout's coordinate system.
Parameters:
Name Type Description
viewport {x: number, y: number, w: number, h: number} An object containing properties of the viewport that the component should use after the layout
Deprecated:
Since Description
13.0.0 The setViewport method has been deprecated, please use the setPanZoomState method instead.
Properties:
Name Type Description
h number height
w number width
x number x-coordinate
y number y-coordinate
Returns:
Type
void