Edges Configuration
const element = document.getElementById('canvas');
const canvas = new CanvasBuilder()
.setElement(element)
.setDefaults({
edges: {
shape: {
type: "bezier",
color: "#000",
hasTargetArrow: true,
},
priority: "incremental",
},
})
.build();
EdgesConfig Fields
| Name | Type | Description | Required | Default |
|---|---|---|---|---|
| shape | ShapeConfig | Default edge shape configuration | no | {} |
| priority | Priority | Default edge priority | no | 0 |
ShapeConfig Options
| Name | Configuration | Example |
|---|---|---|
| Bezier | BezierShape | { type: "bezier" } |
| Straight | StraightShape | { type: "straight" } |
| Horizontal | HorizontalShape | { type: "horizontal" } |
| Vertical | VerticalShape | { type: "vertical" } |
| Custom | CustomShape | () => new CustomEdgeShape() |
Priority Options
| Type | Description | Example |
|---|---|---|
number | Each edge is assigned a constant Z-index | 5 |
"incremental" | Each subsequent edge receives an incremented Z-index | "incremental" |
function | Z-index is determined by a specified function | () => 10 + i++; |