LayoutManager

Import it from @grafloria/engine.

Layout Manager

ts
Copy
class LayoutManager

Methods

• constructor(diagram: DiagramModel, initialAlgorithm: LayoutAlgorithmType = 'grid')
• registerAlgorithm(type: LayoutAlgorithmType, algorithm: ILayoutAlgorithm): void — Register a layout algorithm
• getAlgorithm(type: LayoutAlgorithmType): ILayoutAlgorithm | undefined — Get registered algorithm
• getAvailableAlgorithms(): LayoutAlgorithmType[] — Get all registered algorithm types
• setAlgorithm(type: LayoutAlgorithmType, config?: LayoutConfiguration): void — Switch to a different layout algorithm
• getCurrentAlgorithm(): ILayoutAlgorithm — Get current layout algorithm
• getCurrentAlgorithmType(): LayoutAlgorithmType — Get current algorithm type
• calculatePlacement( node: NodeModel, viewport: Rectangle, options?: Partial<PlacementOptions> ): PlacementResult — Calculate placement for a new node
• async reLayout(config?: LayoutConfiguration): Promise<void> — Re-layout all nodes using current algorithm Option 3: Supports animation and locked node constraints
• selectOptimalPorts( sourceNode: NodeModel, targetNode: NodeModel, layoutContext?: { direction?: 'TB' | 'LR' | 'RL' | 'BT'; ranks?: Map<string, number>; } ): { sourcePort: any; targetPort: any } | undefined — Select optimal ports based on layout-aware algorithm

Uses layout-aware analysis based on academic research:

• Considers layout direction (TB/LR/RL/BT)
• Classifies edges as forward/backward/cross relative to layout flow
• Uses hierarchical rank information when available
• Falls back to geometric analysis for non-hierarchical layouts

Algorithm based on "Drawing Layered Graphs with Port Constraints" (Spönemann et al., 2013)

• optimizeConnections(layoutContext?: { direction?: 'TB' | 'LR' | 'RL' | 'BT'; ranks?: Map<string, number>; }): number — Optimize all connections after layout

Reassigns ports for all links based on current node positions and layout context. This ensures connections look natural after layout algorithms reposition nodes.

Now public and layout-aware - uses hierarchical rank information when available to apply academic research-based port assignment (Spönemann et al., 2013).

• configure(config: LayoutConfiguration): void — Configure current layout algorithm
• getConfiguration(): LayoutConfiguration — Get current configuration
• on(eventType: string, callback: (event: DiagramLayoutEvent) => void): void — Subscribe to layout events
• off(eventType: string, callback: (event: DiagramLayoutEvent) => void): void — Unsubscribe from layout events
• dispose(): void — Clean up resources