Connection¶
The connection configuration section controls how the connections between the nodes are drawn. These properties do not affect the positioning of the nodes, they only control the visual appearance of the connection shapes.
‘curve’ style¶
The curve connection style draws a curve like shape between two connected nodes. The shape is composed of two Bezier curves that are capped at both ends. It is possible to configure the start and end widths of the connection shape and various factors that affect the positioning of the curves’ control points.
If a parent node has only a single child node, then connection is drawn as a straight line.
Properties¶
- nodeLineWidthStart¶
- Type
- Number
- Values
- >0.0
- Default
- 9.8
Width of the connection curve at the start (parent node end).
- nodeLineWidthEnd¶
- Type
- Number
- Values
- >0.0
- Default
- 1.4
Width of the connection curve at the end (child node end).
- nodeCx1Factor¶
- Type
- Number
- Default
- 0.7
X-factor of the first control point of the connection curve. The X position of the first control point is calculated by multiplying this value by the horizontal distance between the two nodes then adding the result to the X position of the parent node. It is recommended to use values between 0.0 and 1.0 for property.
- nodeCx2Factor¶
- Type
- Number
- Default
- .28
X-factor of the second control point of the connection curve. The X position of the second control point is calculated by multiplying this value by the horizontal distance between the two nodes then adding the result to the X position of the child node. It is recommended to use values between 0.0 and 1.0 for this property.
- nodeCy1Factor¶
- Type
- Number
- Default
- 0.0
Y-factor of the first control point of the connection curve. The Y position of the first control point is calculated by multiplying this value by the vertical distance between the two nodes then adding the result to the Y position of the parent node. It is recommended to use values between 0.0 and 1.0 for property.
- nodeCy2Factor¶
- Type
- Number
- Default
- 0.0
Y-factor of the second control point of the connection curve. The Y position of the second control point is calculated by multiplying this value by the vertical distance between the two nodes then adding the result to the Y position of the child node. It is recommended to use values between 0.0 and 1.0 for property.
‘junction’ style¶
The junction connection style connects nodes with shapes that resemble a fork with an optional junction sign . The branches of the fork consist of line segments that are always parallel with the coordinate axes. It is possible to configure the position and appearance of the junction point of the fork and the shape of the corners where the horizontal and vertical lines meet.
Properties¶
- lineWidth¶
- Type
- Number
- Values
- >0.0
- Default
- 4.0
Width of the line connecting the nodes.
- junctionXFactor¶
- Type
- Number
- Values
- 0.0–1.0
- Default
- 0.4
Horizontal position of the junction sign in relation to the total horizontal width of the connection line. A value of 0.0 positions the junction sign at the parent’s end of the connection and a value of 1.0 at the children’s end.
junctionXFactor = 0.0
junctionXFactor = 0.5
junctionXFactor = 1.0
- cornerStyle¶
- Type
- Enum
- Values
- square, beveled, rounded
- Default
- rounded
Style of the corners of the connection lines.
square
beveled
rounded
- cornerRadius¶
- Type
- Number
- Values
- >0.0
- Default
- 12.0
Radius of the corners of the connection lines. The value has no effect if the cornerStyle property is set to square.
Tip
The radius is automatically capped at the maximum allowable value to prevent the connection shapes from overlapping. This lends itself to a neat trick to draw the corners always with the maximum allowable radius by setting the corner radius to a very large value (as shown on the second image).
cornerRadius = 10
cornerRadius = 1000
- cornerPad¶
- Type
- Number
- Values
- >0.0
- Default
- 0.0
- junctionStyle¶
- Type
- Enum
- Values
- none, square, disc, diamond.
- Default
- disc
Style of the junction shape.
none
square
disc
diamond
- junctionRadius¶
- Type
- Number
- Values
- >0.0
- Default
- 10.0
Radius of the junction shape.
- junctionFillColor¶
- Type
- Color
- Default
- baseColor
Fill color of the junction shape.
- junctionStrokeWidth¶
- Type
- Number
- Values
- >0.0
- Default
- 2.0
Stroke width of the outline of the junction shape.
- junctionStrokeColor¶
- Type
- Color
- Default
- baseColor
Stroke color of the outline of the junction shape.
- junctionSign¶
- Type
- Enum
- Values
- none, plus, minus
- Default
- none
Style of the sign inside the junction shape.
none
plus
minus
- junctionSignSize¶
- Type
- Number
- Values
- >0.0
- Default
- 10.0
Size of the junction sign.
- junctionSignStrokeWidth¶
- Type
- Number
- Values
- >0.0
- Default
- 2.0
Stroke width of the junction sign.
- junctionSignColor¶
- Type
- Color
- Default
- baseColor.blend(bgColor, .7)
Color of the junction sign.