使用JAVA与GraphViz，在后端绘制流程图

1、背景介绍

最近在学用JAVA做后端，有个需求是：先用文件把许多操作流程图存下来。然后，当用户在前端使用相应功能时，给用户显示对应操作的流程图，方便让用户看到自己做到哪里了，接下来需要做什么。同时，流程图中的选择，有一些需要用户输入作为判据。

针对上述需求，我的任务是：

1. 如何存储这些流程图？

2. 如何绘制对应流程图并传给前端？

而困难是：技术水平有限，有的方案即便能解决，我也不一定能用明白。

带着任务，面对着困难，我开启了调研。

2、找过的解决方案

2.1、 AsposeJavaAPI

最先查找到的是这个叫做AsposeJavaAPI的，链接贴在这里。在 Java 中以编程方式创建流程图 |制作流程图

实际没有尝试它，因为看它写着请求申请临时许可、付费限制啥的。

2.2、 graphviz-java

作者在github上写的描述是“Use graphviz with pure java”。我一看这玩意对劲啊，就试了试。链接也贴在这里。

GitHub - nidi3/graphviz-java: Use graphviz with pure java

按照github上的说明，通过maven导入一些依赖就能够使用它了。我尝试着在java中用它画图，但苦于没找到详细的使用文档，细节上的功能不太能用明白。再加上如果使用它，那么我的每一个流程图都会被存储为对象。考虑到几十个长流程图，我认为自己不能完美地用它解决问题，所以就也搁置了。而大家如果需要简单绘制流程图，其实graphviz的示例代码就够用了。

2.3、 .dot存储流程图，Java调用graphviz生成图片

此时和我最终选择的解决方案已经很接近了，graphviz里用的dot语言拿来存流程图是挺不错的选择，而且我也在命令行里试过了，能用。于是就开始哐哐查调用的代码。

但是自己了解的内容实在有限，输入参数的部分没写明白，所以对我而言，这个方案就也寄了。

2.4、 .dot存储流程图，Java调用别人写好的graphvizAPI生成图片

在上述的漫长调研过程中，我曾经看到过这样一篇博客《在Java环境中使用GraphViz绘图》。

在Java环境中使用GraphViz绘图_java中如何调用graphviz-CSDN博客

起初试了一下，自认为是用来在Java中绘制流程图的，难以满足调用存储好的.dot文件的需求。于是就放弃了。但又一次查到的时候，翻看到了代码最后，它里面第340行里注释的说明提示了我：这玩意能读.dot文件啊！

 /**
     * Read a DOT graph from a text file.
     * 
     * @param input Input text file containing the DOT graph
     * source.
     */

于是我尝试了一下，最后也选择采用这一方案。在第3节中，我将进行具体介绍。

3、 具体介绍：使用.dot存储多个流程图，需要时用Java调用别人写好的graphvizAPI生成图片

首先，需要安装graphViz。

Download | Graphviz

大家对应选择，完成安装即可。安装过程中它会有提示问你是否设置环境变量，需要选一下。要是没选的话，安装完毕之后，记得配置一下环境变量。具体的安装和配置过程可以参考下面的文章：

一小时实践入门 Graphviz - 知乎

安装完毕后，转战Java代码。此时参考下面这篇文章的1、2部分照做即可，很详细。

在Java环境中使用GraphViz绘图_java中如何调用graphviz-CSDN博客

在完成上述操作后，想测试至少要有个.dot文件。我这里用的代码是

digraph test1{
    A -> B;    A -> C;   B -> D;    C -> D
}

文件名写的是hello.dot（当时乱起的，和内容对不上，不过就拿来测试一下，无所谓了）

在Java程序里对应用到的代码是

public class flowChart {
    public static void main(String[] args) throws IOException, InterruptedException {
        GraphViz gv=new GraphViz();
        String input = "hello.dot";
        gv.readSource(input);
        String type = "svg";
        File out = new File("hello." + type);
//        gv.decreaseDpi();
        gv.writeGraphToFile( gv.getGraph( gv.getDotSource(), type ), out );
    }
}

这里完成的操作是：读取.dot文件，并把它绘制成.svg存储。这里有个小问题是，我用.svg存储时，流程图显示不全。这一情况主要应该是dpi的问题，可以通过调整别人写的那个graphvizAPI里的currentDpiPos的值来解决。

或者不改默认设置，在自己的程序里用下面这两个方法来调整也行。

gv.decreaseDpi();

gv.increaseDpi();

最终生成的.svg效果如下：