Graphviz 工具

Graphviz 是一款开源的图形可视化软件，专门用于将结构化信息（如图、网络、树等）自动渲染为可视化图形。它的核心思想是让用户用文本描述节点与关系，再由软件自动完成布局与渲染，从而摆脱手动拖拽图形的繁琐工作。Graphviz 是一个将“描述”转化为“图形”的强大工具，尤其适合技术写作场景。

好处说完了，那坏处呢？真正用起来你就会发现，想要画出满意的图并不是那么容易的——最初我想把它用于绘制链表的示意图，在 单链表 一文中大量使用，这里也记录一下曾经使用的 dot 代码 版本。

循环单链表（原图参考 StackOverflow）：

另一个实现版本，虽然能实现线段拐弯是直角，但没法精准控制线段两端位置：

最终用 AI 搜了一下，发现 neato 或 fdp 引擎可以指定坐标来布局，这就比较符合我们的绘图需求了：

指针示意图（原图出自 StackOverflow，具体链接忘了）：

一个复杂的案例（出自 forum.graphviz）：

方形节点的二叉树：

比较好看但不完美的二叉树（出自 用 Graphviz 绘制一棵漂亮的二叉树 - 南浦月）：

有限状态自动机：

相关链接

https://quickchart.io/documentation/graphviz-api/：免费的在线 API，不仅仅只是 Graphviz，可绘制的图表类型非常丰富，响应速度也很快，适合用 <img> 标签把图表 dot 源码放参数里，非常方便。

https://www.gravizo.com ：我最初于 2022 年使用的 Web API，但现在已经挂了。

https://github.com/mdaines/viz-js：开源 npm 库，本博客就引用了该库。

https://fly63.com/tool/graphviz/：在线 Graphviz 预览和编辑器，fly 63 工具箱

https://github.com/magjac/graphviz-visual-editor：开源项目的，在线体验：https://magjac.com/graphviz-visual-editor/

https://github.com/dreampuf/GraphvizOnline/：开源项目，支持较多引擎，在线体验：https://dreampuf.github.io/GraphvizOnline/，支持带参数分享。

https://github.com/nikeee/edotor.net：开源项目，在线体验：https://edotor.net/，支持带参数分享。

https://sketchviz.com/ 支持手绘风格，似乎不是开源的，支持下载 png 格式，必须登陆 github 并保存才能分享链接。