Specifies custom layout data for the GivenCoordinatesLayout.
Examples
The following example shows how to create a new instance of GivenCoordinatesLayoutData<TNode,TEdge,TNodeLabel,TEdgeLabel> and use it with a GivenCoordinatesLayout:
const layoutData = new GivenCoordinatesLayoutData()
// Resize all nodes to same size
layoutData.nodeSizes = new Size(30, 30)
// Reset all edge paths
layoutData.edgePaths = IEnumerable.from([])
// Combine the layout data of the stage and the core layout
const compositeLayoutData = coreLayoutData.combineWith(layoutData)
graphComponent.graph.applyLayout(
new GivenCoordinatesLayout(coreLayout),
compositeLayoutData,
)In many cases the complete initialization of GivenCoordinatesLayoutData<TNode,TEdge,TNodeLabel,TEdgeLabel> can also be done in a single object initializer:
const layoutData = new GivenCoordinatesLayoutData({
// Resize all nodes to same size
nodeSizes: new Size(30, 30),
// Reset all edge paths
edgePaths: IListEnumerable.EMPTY,
})
// Combine the layout data of the stage and the core layout
const compositeLayoutData = coreLayoutData.combineWith(layoutData)
graphComponent.graph.applyLayout(
new GivenCoordinatesLayout(coreLayout),
compositeLayoutData,
)Type Parameters
- TNode
- TEdge
- TNodeLabel
- TEdgeLabel
Type Details
- yFiles module
- algorithms
Constructors
Creates a new instance of GivenCoordinatesLayoutData<TNode,TEdge,TNodeLabel,TEdgeLabel> which helps to configure GivenCoordinatesLayout.
Parameters
A map of options to pass to the method.
- nodeLocations - ItemMapping<TNode,IPoint>
- The mapping from nodes to their initial location. This option either sets the value directly or recursively sets properties to the instance of the nodeLocations property on the created object.
- nodeSizes - ItemMapping<TNode,ISize>
- The mapping from nodes to their sizes. This option either sets the value directly or recursively sets properties to the instance of the nodeSizes property on the created object.
- edgePaths - ItemMapping<TEdge,IEnumerable<IPoint>>
- A mapping from edges to their initial edge paths. This option either sets the value directly or recursively sets properties to the instance of the edgePaths property on the created object.
Properties
Gets or sets a mapping from edges to their initial edge paths.
Remarks
Before calling the core layout algorithm, the GivenCoordinatesLayout sets the path of each edge to the mapped point path. The path must contain the source port location, followed by the bends (if any), followed by the target port location.
If an empty path is specified, the current path will be reset (all bends are cleared, the current source/target port locations are kept). The path of edges that have no associated path are not changed by the stage.
Examples
The easiest option is to reset all paths, by setting a constant empty path:
// reset all edge paths
layoutData.edgePaths = IEnumerable.from([])Handling only certain edges differently can be done easily by using the mapper property:
// reset the edge paths of edge1
layoutData.edgePaths.mapper.set(edge1, IEnumerable.from([]))
// and edge2
layoutData.edgePaths.mapper.set(edge2, IEnumerable.from([]))
// all other edges don't change their pathsIn cases where the path for each edge can be determined by looking at the edge itself it's often easier to just set a delegate instead of preparing a mapper:
// make all edge orthogonal
layoutData.edgePaths = (edge: IEdge): IEnumerable<IPoint> => {
const sourceLocation = edge.sourcePort.location
const targetLocation = edge.targetPort.location
return new List<IPoint>([
sourceLocation,
new Point(sourceLocation.x, targetLocation.y),
targetLocation,
])
}See Also
Gets or sets the mapping from nodes to their initial location.
Remarks
Examples
The easiest option is to place all nodes at the same location, by setting a constant location:
// place all nodes to the center of the GraphComponent
layoutData.nodeLocations = graphComponent.viewport.centerHandling only certain nodes differently can be done easily by using the mapper property:
// node1 get the initial location (10, 20)
layoutData.nodeLocations.mapper.set(node1, new Point(10, 20))
// and node2 (50, 70)
layoutData.nodeLocations.mapper.set(node2, new Point(50, 70))
// all other nodes don't change their initial locationsIn cases where the location for each node can be determined by looking at the node itself it's often easier to just set a delegate instead of preparing a mapper:
// Align all nodes horizontally to x = 0
layoutData.nodeLocations = (node: INode): IPoint =>
new Point(0, node.layout.y)See Also
Gets or sets the mapping from nodes to their sizes.
Remarks
Examples
The easiest option is to resize all nodes to the same dimension, by setting a constant size:
// resize all nodes to (30, 30)
layoutData.nodeSizes = new Size(30, 30)Handling only certain nodes differently can be done easily by using the mapper property:
// node1 get the size (10, 20)
layoutData.nodeSizes.mapper.set(node1, new Size(10, 20))
// and node2 (50, 70)
layoutData.nodeSizes.mapper.set(node2, new Size(50, 70))
// all other nodes don't change their dimensionsIn cases where the dimension for each node can be determined by looking at the node itself it's often easier to just set a delegate instead of preparing a mapper:
// all nodes grow by 50%
layoutData.nodeSizes = (node: INode): ISize =>
node.layout.toSize().multiply(1.5)See Also
Methods
combineWith
(data: LayoutData<TNode,TEdge,TNodeLabel,TEdgeLabel>…) : LayoutData<TNode,TEdge,TNodeLabel,TEdgeLabel>Combines this instance with the given layout data.
Remarks
Parameters
A map of options to pass to the method.
- data - LayoutData<TNode,TEdge,TNodeLabel,TEdgeLabel>
- The LayoutData<TNode,TEdge,TNodeLabel,TEdgeLabel> to combine this instance with.
Returns
- ↪LayoutData<TNode,TEdge,TNodeLabel,TEdgeLabel>
- The combined layout data.