Concentric Layout
Concentric Layout places the nodes on concentric circles.
Usage
As the demo below, you can deploy it in layout
while instantiating Graph. it can also be used for Subgraph Layout. This algorithm will order the nodes according to the parameters first, then the node in the front of the order will be placed on the center of the concentric circles.
center
Type: Array
Example: [ 0, 0 ]
Default: The center of grpah
Required: false
Explanation: The center of the layout
preventOverlap
Type: Boolean
Default: false
Required: false
Explanation: Switch to prevent the node overlappings. It should be used with nodeSize
. Only if the nodeSize
is assigned, the collide detection will take effect.
nodeSize
Type: Number
Default: 30
Required: false
Explanation: The size of the node(diameter). It will be used in collide dectection for preventing node overlappings.
minNodeSpacing
Type: Number
Default: 10
Required: false
Explanation: The min distance between rings.
sweep
Type: Number
Default: undefined
Required: false
Explanation: How many radians should be between the first and last node (defaults to full circle). If it is undefined, 2 * Math.PI * (1 - 1 / |level.nodes|) will be used, where level.nodes is nodes set of each level, |level.nodes| is the number of nodes of the level.
equidistant
Type: Boolean
Default: false
Required: false
Explanation: Whether levels have an equal radial distance between them, may cause bounding box overflow.
startAngle
Type: Number
Default: 3 / 2 * Math.PI
Required: false
Explanation: Where nodes start in radians.
clockwise
Type: Boolean
Default: false
Required: false
Explanation: Place the nodes in clockwise or not.
maxLevelDiff
Type: Number
Default: undefined
Required: false
Explanation: The sum of concentric values in each level. If it is undefined, maxValue / 4 will take place, where maxValue is the max value of ordering properties. For example, if sortBy='degree', maxValue is the max degree value of all the nodes.
sortBy
Type: String
Default: undefined
Required: false
Explanation: Order the nodes according to this parameter. It is the property's name of node. The node with higher value will be placed to the center. If it is undefined, the algorithm will order the nodes by their degree.