17370845950

敲代码前先构思一下-Graphviz-01

在编写代码之前,构思架构是至关重要的。许多开发者在编写代码时可能会边思考边编写,这样的方法在面对复杂问题时可能会导致后期需要大量返工甚至推倒重来。对于个人项目,建议先绘制逻辑流程图来明确思路。提到流程图,很多人会想到微软的visio,但今天我们将介绍一个不同的工具——graphviz。

Part 1:VISIO与Graphviz的对比

VISIO通常需要手动绘制,理论上可以绘制出任何图形,但这非常耗时,尤其是在需要修改时,整个图可能都要重新调整。我们的目标更多是逻辑清晰而非美观,因此需要一个方便、迭代速度快的工具。Graphviz通过渲染dot语言来生成图形,dot语言易于学习和修改,只需调整代码即可重新生成图形。

Graphviz官网:https://www./link/983174e6fd6f1703152b7d4c23518aa7

使用Graphviz绘图的示例1(来自官网):

使用Graphviz绘图的示例2(来自官网):

使用Graphviz绘图的示例2的dot代码(来自官网):

graph G {
    e
    subgraph clusterA {
        a -- b;
        subgraph clusterC {
            C -- D;
        }
    }
    subgraph clusterB {
        d -- f
    }
    d -- D
    e -- clusterB
    clusterC -- clusterB
}

代码截图:

Part 2:dot语法

dot语言包含三大对象:图(graph)、点(node)和线(edge)。以下是对上述代码的解读:

  • 第1行:定义了一个名为G的图(graph G)。
  • 第2行:定义了一个节点e(可以先定义,也可以直接使用)。
  • 第3行:定义了一个子图(subgraph),名为clusterA,子图中的所有对象会用一个框封闭。
  • 第4行:定义节点a和节点b,并连接它们(a -- b)。
  • 第5行:定义了一个子图(subgraph),名为clusterC,这相当于子图中的子图。
  • 第14行:子图clusterC指向子图clusterB(clusterC -- clusterB)。

通过使用Graphviz和dot语言,您可以更高效地绘制和修改逻辑流程图,从而更好地规划和实现您的代码项目。