如何创建具有直接顶级路径和分组子路径的图形答案

【问题标题】：how to create a graph with a straight top-level path and grouped sub-paths如何创建具有直接顶级路径和分组子路径的图形
【发布时间】：2021-10-19 02:02:38
【问题描述】：

我有一个通用的数据流结构，它基本上由顶层决策堆栈组成。每个决定都会引导您在堆栈中上下移动，直到堆栈中间发生终止事件，或者直到到达堆栈的顶部或底部。一些决定涉及检查布尔条件以确定要做出哪些决定。我正在寻求一些帮助，以使输出更清楚地捕捉思维过程，这似乎主要是分组/排名方面的问题，但也可能是其他问题。

我第一次通过的 graphviz 代码如下所示，并使用dot 呈现，给出了以下图表：

虽然这是我正在制作的决策堆栈的准确图表，但我希望让它看起来更像这样：

这里是graphviz代码：

graph decision_path {
    node [shape="rectangle"]
    edge [dir="both"]
    newrank=true
    
    Top
    d1 [label="Decision 1"]
    cd1 [label="Composite Decision 1"]
    cd2 [label="Composite Decision 2"]
    d2 [label="Decision 2"]
    d3 [label="Decision 3"]
    d4 [label="Decision 4"]
    source [label="Decision Source" style="filled" color="#EEFFEE"]
    
    Top -- d1 [dir="back"]
    d1 -- cd1
    cd1 -- cd2
    cd2 -- d2
    d2 -- d3
    d3 -- d4
    d4 -- Bottom [dir="forward"]
    
    cd1 -- source [dir="back"]
    
    subgraph {
        node [style=filled, color="#EEEEFF"]
        cd1_d1 [label="Kill"]
        cd1_d2 [label="Continue"]
        cd1_d1 -- cd1_d2 [dir="forward"]
        subgraph {
            rank=same
            node [style=filled color="#FFEEEE"]
            cd1_d1_c1 [label="Conditional 1"]
            cd1_d1 -- cd1_d1_c1 [dir="forward"]
        }
    }
    cd1 -- cd1_d1 [dir="forward"]
    
    subgraph {
        node [style=filled, color="#EEEEFF"]
        cd2_d1 [label="Continue"]
        cd2_d2 [label="Kill"]
        cd2_d1 -- cd2_d2 [dir="forward"]
        subgraph {
            rank=same
            node [style=filled color="#FFEEEE"]
            cd2_d1_c1 [label="Conditional 1"]
            cd2_d1_c2 [label="Conditional 2"]
            cd2_d1 -- cd2_d1_c1 [dir="forward"]
            cd2_d1_c1 -- cd2_d1_c2 [dir="forward"]
        }
        
    }
    cd2 -- cd2_d1 [dir="forward"]
}

【问题讨论】：

标签： graphviz

【解决方案1】：

将 rankdir 更改为 LR - 也许没有必要，但似乎工作得很好。

graph decision_path {
    rankdir=LR
    node [shape="rectangle"]
    edge [dir="both"]
    newrank=true
    nodesep=.6
    
    { rank=same
    Top
    d1 [label="Decision 1"]
    cd1 [label="Composite Decision 1"]
    cd2 [label="Composite Decision 2" group=cd2g]
    d2 [label="Decision 2"]
    d3 [label="Decision 3"]
    d4 [label="Decision 4"]
    Bottom
    }
    source [label="Decision Source" style="filled" color="#EEFFEE"]

    Top -- d1 [dir="back"]
    d1 -- cd1
    cd1 -- cd2
    cd2 -- d2
    d2 -- d3
    d3 -- d4
    d4 -- Bottom [dir="forward"]
    
    source -- cd1  
    
    subgraph {
        node [style=filled, color="#EEEEFF"]
        cd1_d1 [label="Kill"]
        cd1_d2 [label="Continue"]
        cd1_d1 -- cd1_d2 [dir="forward"]
            node [style=filled color="#FFEEEE"]
            cd1_d1_c1 [label="Conditional 1" ]
            cd1_d1 -- cd1_d1_c1 [dir="forward"]
    }
    cd1 -- cd1_d1 [dir="forward"]
    
    subgraph {
        node [style=filled, color="#EEEEFF"]
        cd2_d1 [label="Continue" group=cd2g]
        cd2_d2 [label="Kill"]
        cd2_d1 -- cd2_d2 [dir="forward"]
            node [style=filled color="#FFEEEE"]
            cd2_d1_c1 [label="Conditional 1" group=cd2g]
            cd2_d1_c2 [label="Conditional 2" group=cd2g]
            cd2_d1 -- cd2_d1_c1 [dir="forward"]
            cd2_d1_c1 -- cd2_d1_c2 [dir="forward"]
    }
    cd2 -- cd2_d1 [dir="forward"]
}

捐赠：

【讨论】：

您可以将相同的结构应用于子图中的蓝色框，以提供几乎与我正在寻找的东西完全相同的东西。非常感谢