documentationfor yFiles for HTML 2.6

SingleCycleLayout

This layout algorithm places all nodes of a graph on a single cycle.

Inheritance Hierarchy
MultiStageLayout
SingleCycleLayout
Implemented Interfaces

Remarks

Layout Style

All nodes of a graph are placed on one common circle, generating circular layouts. The edges are drawn as simple, straight lines. The resulting layouts look like a ring. Edges connecting nodes which are not next to each other on the ring are routed inside of the circle.

Single-cycle circular layouts are suitable for the visualization of networks such as ring networks or smaller social networks. They are also useful to layout cyclic subgraphs of a larger graph.

An example of a single cycle layout

Concept

First, the nodes are sorted by applying either a custom or some default INodeSequencer. Then, all nodes are placed on a circle with an appropriate radius according to the calculated order.

Features

The order in which the nodes are placed on the circle is a crucial aspect of this algorithm. By specifying a INodeSequencer instance via nodeSequencer, the order can be customized.

There are two options to determine the radius of the circle on which nodes are placed:

  1. The radius can be determined automatically. A specified minimum radius will be obeyed when choosing the radius.
  2. The radius can be chosen manually. To do so, disable the automatic radius selection and specify the custom radius via fixedRadius.

Default Values of Properties

automaticRadiustrueThe radius will be chosen automatically.
fixedRadius200
fromSketchModefalseThe coordinates of the input diagram are not considered.
minimumNodeDistance30
orientationLayoutEnabledtrueThe orientation is activated.
selfLoopRouterEnabledtrueThe stage that routes self-loops is activated.

Type Details

yfiles module
layout-organic
yfiles-umd modules
layout-multipage, layout-organic, layout
Legacy UMD name
yfiles.circular.SingleCycleLayout

See Also

Constructors

Properties

Methods