Eclipse Layout Kernel (ELK) Documentation

repository·master·Indexed 18 days ago

https://github.com/eclipse-elk/elk

A collection of layout algorithms for diagrams and visual languages. ELK provides a Java-based core for general use and Eclipse-based infrastructure for editor integration. It includes specialized algorithms such as rectpacking for stacking rectangles, Libavoid for orthogonal edge routing, and various layered layout strategies for cycle breaking, crossing minimization, and top-down layout scaling. Web-based alternatives include ELK Live and the elkjs JavaScript library.

Tokens
35.8K
Snippets
60
Records
162
Agent score
63%

What's inside Eclipse Layout Kernel (ELK)

  1. Overview of the Eclipse Layout Kernel (ELK)

    master

    The Eclipse Layout Kernel (ELK) provides an infrastructure designed to bridge diagram editors or viewers with automatic layout algorithms. It serves two primary purposes:

    1. Providing a standard interface for tools to request layouts.
    2. Supplying built-in layout algorithms that can be used immediately without custom implementation.

    Developers typically interact with ELK as either tool developers (integrating layout into an editor) or algorithm developers (implementing new layout logic using ELK's graph data structures).

  2. Overview of Eclipse Layout Kernel (ELK)

    master
    The Eclipse Layout Kernel (ELK) provides a collection of layout algorithms designed to automate the positioning of elements in diagrams and visual languages. While it includes infrastructure to connect to Eclipse-based editors and viewers, the core layout algorithms are implemented in plain Java, allowing them to be used in any Java environment outside of Eclipse.
  3. Understand the ELK reference structure

    master

    The ELK reference documentation is organized into three primary areas to help you configure layouts:

    1. Layout algorithms: A list of available algorithms. To use an algorithm, you must provide its unique identifier. This section also details the specific layout options supported by each algorithm.
    2. Layout options: A comprehensive list of all available configuration parameters used to tune layout algorithms. It is recommended to first identify your desired algorithm and then consult this section to see which options it supports.
    3. Layout option groups: A categorization of layout options into logical groups, useful for understanding the relationship between different configuration parameters.
  4. Decide between Layout Phases and Intermediate Processors

    master

    When designing a layout algorithm, you must decide whether a component should be implemented as a Phase or an Intermediate Processor. Use these guidelines:

    • Use a Phase if the component is an essential, fundamental part of the algorithm that is always present, or if you want to allow different implementations of that specific stage (e.g., different ways to handle a 'sizing' stage).
    • Use an Intermediate Processor for logic that is more granular or optional within a specific processing slot.
  5. Understand the Radial Layouter lifecycle and phases

    master

    The Radial layouter operates through a sequence of steps divided into Phases and Processors.

    Phases (Essential)

    Phases are mandatory for a valid radial layout. If these are not implemented, the layouter cannot function. The two core phases are:

    1. Node placement: Assigns positions to nodes.
    2. Edge routing: Determines the layout for edges (typically drawing from the center of the source to the center of the target, clipped to avoid node overlap).

    Processors (Optional)

    Processors are intermediate steps that enhance the layout. They are not strictly required for a basic radial layout but improve visual quality:

    • Overlap Removal: Widens radii starting from the innermost ring until no node overlaps occur.
    • Compaction: Makes the layout more compact using one of two strategies:
      • Radial compaction: Contracts radii as much as possible without causing overlaps.
      • Wedge compaction: Compacts nodes within each wedge by contracting radii, which may break radius alignment but increases density.
    • Graph Size Calculation: A post-processing step that moves the root from the origin to the positive area and calculates the total bounding box required for display.
  6. Define Edges (Primitive vs. Extended)

    master

    ELK supports two types of edges. While primitive edges are used for legacy support, extended edges are the standard for exported graphs.

    Primitive Edges

    Used for legacy models. They connect a single source node to a single target node.

    {
      "source*": "node-id",
      "sourcePort": "port-id",
      "target*": "node-id",
      "targetPort": "port-id",
      "sourcePoint": { "x": 0, "y": 0 },
      "targetPoint": { "x": 0, "y": 0 },
      "bendPoints": [ { "x": 5, "y": 5 } ],
      "labels": [ { "text": "label text" } ]
    }

    Extended Edges

    Supports hyperedges (connecting multiple sources to multiple targets). They use arrays of identifiers for sources and targets.

    {
      "sources*": [ "node-id-1", "port-id-1" ],
      "targets*": [ "node-id-2", "port-id-2" ],
      "sections": [ { "startPoint": { "x": 0, "y": 0 } } ],
      "labels": [ { "text": "label text" } ]
    }
  7. Inspect layout runs with Debugging Views

    master

    ELK provides three specialized views to inspect layout runs. All views feature a tree viewer of layout runs on the left side. You can access them via Window -> Show View -> Other -> Eclipse Diagram Layout.

    Layout Time View

    Displays time spent in each progress monitor.

    • time: Total time spent in a monitor including all its sub-monitors.
    • local time: Time spent in the monitor alone, excluding sub-monitors.

    Layout Log View

    Displays all log messages submitted via IElkProgressMonitor.log(Object). A blue icon in the tree indicates a monitor has associated log messages.

    Layout Graph View

    Displays logged graphs from IElkProgressMonitor.logGraph(...).

    • ELK graphs: Drawn using exact coordinates and sizes. The area from (0, 0) to (width-1, height-1) has a green background; anything outside this area has a red background.
    • Other formats: Currently displays the source code (e.g., DOT, JSON, SVG).
    • Features: Supports importing/displaying .elkt and .elkg files and saving displayed images as .png.
  8. Choose between Reading Direction and Rotation transformations

    master

    When configuring layout transformations for the layered algorithm, you can choose how the input graph's coordinates are mapped to different layout directions (Top-to-Bottom, Bottom-to-Top, Left-to-Right, or Right-to-Left). This choice affects how the orientation of nodes, edges, and labels is preserved.

    Reading Direction Transformation

    Use this when you want to preserve the logical reading order. The vertical reading direction of a horizontal layout (Left-to-Right or Right-to-Left) is mapped to the horizontal reading direction of a vertical layout (Top-to-Bottom or Bottom-to-Top). This ensures that the sequence of nodes and labels remains consistent with standard reading patterns.

    Rotation Transformation

    Use this when you want to preserve the physical orientation of the drawing. The four possible layout directions are treated as simple rotated versions of a Left-to-Right layout. This is particularly useful if you need to preserve a specific clockwise orientation of feedback loops or other geometric structures in your graph.

  9. Use Topdown Size Approximators

    master

    To help the layout engine determine node sizes before the actual layout computation, you can assign a TopdownSizeApproximator to HIERARCHICAL_NODEs.

    One available implementation is COUNT_CHILDREN, which calculates the proportional factor for node sizes using sqrt(number_of_children). You can also implement custom, arbitrarily complex size approximators.

  10. Understand Layout View Support

    master

    If UI components are installed, ELK provides a Layout View within the workbench. This view acts as a specialized properties view designed specifically for configuring layout properties.

    Key Behaviors:

    • Selection Awareness: It listens to selection changes in the workbench.
    • Automatic Activation: If the selected item is recognized as an element of a graph that ELK can layout, the view allows users to customize the specific layout options for that element.

    Usage Note: Because the available layout options are numerous and highly technical (requiring knowledge of layout algorithms), the Layout View is primarily intended for tool developers and power users rather than general end-users.

  11. Understand space-able elements in ELK

    master

    In ELK, spacing can be applied to several core graph elements. These elements are treated differently depending on their geometry:

    • Nodes, Ports, and Labels: These are treated as 'boxes' with space to be left around them.
    • Edges: These are not treated as boxes.
    • Connected Components: These may have more complex geometries than simple boxes.

    Additionally, the ELK Layered algorithm introduces the concept of layers, which provides specific spacing options for controlling distances between layers.

  12. How the ShrinkTree approach works

    master

    The ShrinkTree approach is a method for node overlap removal based on a modified algorithm by Nachmanson et al. It follows these steps:

    1. Triangulation: A Delaunay triangulation is performed on the set of vertices representing the nodes' centers.
    2. Tree Construction: A spanning tree is constructed using the edges from the Delaunay triangulation.
    3. Shrinking: The spanning tree is 'shrunk,' which pulls the nodes closer together to compact the layout.