Edges and routing

Arrow tokens

An arrow is an optional <, a body of -, = or ., and an optional >.

• - solid, = thick, . dashed
• > at the end puts a head on the target, < at the start on the source
• a -- b draws no heads

graph dir=LR rank-gap=140 node-gap=18
css "theme.css"

a1 -> b1 "->"
a2 ==> b2 "==>"
a3 ..> b3 "..>"
a4 <-> b4 "<->"
a5 -- b5 "--"

Routing styles

route=curve|bend|ortho|straight, per edge, per group (default edge route=…) or graph-wide.

# Same fan-out, four routing styles side by side
graph dir=LR layout=row gap=40

group curve "route=curve" layout=layered dir=TB {
  default edge route=curve
  a1 "source"; a1 -> b1, c1, d1
}
group bend "route=bend" layout=layered dir=TB {
  default edge route=bend
  a2 "source"; a2 -> b2, c2, d2
}
group bend2 "bend radius=24 stub=8" layout=layered dir=TB {
  default edge route=bend radius=24 stub=8
  a3 "source"; a3 -> b3, c3, d3
}
group ortho "route=ortho" layout=layered dir=TB {
  default edge route=ortho radius=10
  a4 "source"; a4 -> b4, c4, d4
}

Diagonals

bend and ortho edges have one sideways jog. diagonal=N lets that jog slant when the offset is at most N px; diagonal-angle=45 sets the slant.

# Diagonal policy demo: same graph, three settings side by side.
# p and q share child y, so y sits between them: short sideways offsets (p->y, q->y)
# next to long ones (p->x, q->z).
graph dir=LR layout=row gap=40
css { group { font-size: 11px; } }

group auto "bend (default: diagonal=40)" dir=TB route=bend {
  p1 "p"; q1 "q"
  x1 "x"; y1 "shared y"; z1 "z"
  p1 -> x1, y1
  q1 -> y1, z1
}

group never "diagonal=none" dir=TB route=bend diagonal=none {
  p2 "p"; q2 "q"
  x2 "x"; y2 "shared y"; z2 "z"
  p2 -> x2, y2
  q2 -> y2, z2
}

group always "diagonal=always" dir=TB route=bend diagonal=always {
  p3 "p"; q3 "q"
  x3 "x"; y3 "shared y"; z3 "z"
  p3 -> x3, y3
  q3 -> y3, z3
}

Useful attributes

• width=3, head=triangle|open|diamond|dot|bar, head-size=N
• arrow=none|end|start|both overrides the token
• exit=top|bottom|left|right, enter=… pin a side
• weight=N, constraint=false tune the layered layout

Full details: spec, section 3.