为什么PlantUML新增元素会导致部署图整体布局异常重排？

问题描述 #

这是一次中等复杂度部署图的尝试，内容偏向部署类场景。
我逐个添加组件的过程中流程均正常，正常效果如下：

直到我添加“aabb9”（即a9）时出现异常。

当我添加aabb9作为aabb5“向上”箭头的目标时，我预期aabb9会被放置在aabb5上方的空余位置，预期效果如下：

但实际情况是，PlantUML引擎几乎完全重排了整个图表布局，之前定义的关联关系似乎不再被遵守，最终异常效果如下：

可以看到最开始的两个节点现在移到了最右侧，我指定的从aabb1、aabb2向右指向的关联关系不再符合设定的绘制规则。

下方是可正常生成图表的代码，若取消最后一行的注释，整个图表就会发生异常重排：

@startuml
skinparam ranksep 5
skinparam nodesep 5

rectangle "aabb1" {
    node aabb1 as a1
    node aabb2 as a2
}
a1 --[hidden]> a2

control "aabb3" as a3
database "aabb4" as a4
queue "aabb5" as a5
control "aabb6" as a6
control "aabb7" as a7
database "aabb8" as a8
control "aabb9" as a9

a1 -right-> a3: Range
a2 -right-> a3: 3D Models
a3 -down-> a4: Range & Models
a3 -> a5: product.\nupsert

a5 -down-> a6: product.\nupsert
a6 -> a5: product.\nprocessed

a5 -> a7: product.processed
a7 -> a8: Data
a7 -> a5: product.\nstored

'a5 -up-> a9: product.stored

@enduml

请问是什么原因导致该问题？我希望能够通过文本快速生成这类简单图表，感谢解答！

问题解答 #

核心原因 #

PlantUML底层使用Graphviz的dot布局算法，默认会以全局边总长度最短为优化目标，自动调整所有节点的层级（rank）和位置。你添加a5 -up-> a9这条向上箭头时，算法会将a9归类到比a5更高的层级，而原本位于高层级的a1、a2没有设置固定的层级约束，算法为了优化路径长度，就会把a1、a2挪动到a9所在的右侧高层级区域，最终导致整体布局完全重排，违背你之前指定的连接方向规则。

解决方案 #

你可以通过以下任意一种方式固定布局，避免异常重排：

• 固定左侧节点的水平层级：在代码中添加rank same约束，让a1、a2、a3始终保持在同一水平行，不会被算法挪动

' 放在a1、a2、a3定义完成之后即可
rank same; a1; a2; a3;

• 屏蔽新增箭头对层级的影响：给新增的向上箭头添加norank属性，让这条边不参与全局层级计算

a5 -up-[norank]-> a9: product.stored

• 明确指定a9的层级：单独定义a9的层级高于a5，避免算法自动调整时牵连其他节点

' 放在a5、a9定义完成之后即可
rank a9 above a5

以上方案修改后都可以达到你预期的布局效果，不需要改动原有其他逻辑。

内容的提问来源于stack exchange，提问作者mawi