Tighten diagram layout: symmetry, consistent anchors, text padding
This commit is contained in:
@@ -70,18 +70,18 @@ func diagramHTML(_ layout: BoxLayout) -> String {
|
||||
let f = fill(b)
|
||||
svg += "<g class=\"box\" data-id=\"\(esc(b.node.id))\" style=\"--l:\(hex(f, .light));--d:\(hex(f, .dark))\">"
|
||||
svg += "<rect x=\"\(num(r.minX))\" y=\"\(num(r.minY))\" width=\"\(num(r.width))\" height=\"\(num(r.height))\" rx=\"\(b.depth == 0 ? 8 : 6)\"/>"
|
||||
var y = r.minY + pad
|
||||
svg += "<text class=\"title\" x=\"\(num(r.minX + pad))\" y=\"\(num(y + CTFontGetAscent(titleFont)))\">\(esc(b.node.title))</text>"
|
||||
y += titleLine + 2
|
||||
var y = r.minY + padY
|
||||
svg += "<text class=\"title\" x=\"\(num(r.minX + padX))\" y=\"\(num(y + CTFontGetAscent(titleFont)))\">\(esc(b.node.title))</text>"
|
||||
y += titleLine + titleGap
|
||||
for d in b.node.details {
|
||||
svg += "<text class=\"detail\" x=\"\(num(r.minX + pad))\" y=\"\(num(y + CTFontGetAscent(detailFont)))\">\(esc(d))</text>"
|
||||
svg += "<text class=\"detail\" x=\"\(num(r.minX + padX))\" y=\"\(num(y + CTFontGetAscent(detailFont)))\">\(esc(d))</text>"
|
||||
y += detailLine
|
||||
}
|
||||
svg += "</g>"
|
||||
}
|
||||
for (i, e) in layout.edges.enumerated() {
|
||||
svg += "<g class=\"edge\" data-i=\"\(i)\">"
|
||||
svg += "<path d=\"\(edgePath(e.points))\"\(e.edge.dashed ? " stroke-dasharray=\"5 4\"" : "")/>"
|
||||
svg += "<path d=\"\(edgePath(shaft(e.points)))\"\(e.edge.dashed ? " stroke-dasharray=\"5 4\"" : "")/>"
|
||||
if e.points.count >= 2 {
|
||||
svg += "<polygon points=\"\(arrowHead(e.points[e.points.count - 2], e.points[e.points.count - 1]))\"/>"
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user