使用drawio绘制依赖关系图

使用drawio绘制依赖关系图

drawio是一款强大的图表绘制软件，支持在线云端版本以及windows, macOS, linux安装版。 如果想在线直接使用，则直接输入网址draw.io或者使用drawon(桌案), drawon.cn内部完整的集成了drawio的所有功能，并实现了云端存储，以及在线共创，分享，协作的功能。

作为一种有向的图表， 依赖关系图能够可视化处理过程或者一些场景情形， 而这些过程或情形依赖于一些组件，例如决策中的，调度中，以及产品开发， IT或者电信基础设施， 应用、制造链，以及更多。这些能够帮助你找到最佳顺序和关键路径指示， 或者一些约束你应用，基础设施或者过程的薄弱环节。

图形和连接线被应用于依赖关系图中会比较简单——一个图形指示了一个节点（常用的圆形或者矩形），带一个或者两个箭头的连接线指示依赖的方向，连接线可以携带或者不携带标签。

特殊的依赖关系图

一个PERT图表（计划评审技术）是一种类型的依赖关系图， 对于基于任务的项目，包含了对每一个活动的时间评估， 通常在每一个节点上。 与关键路径方法一起使用，它表示了依赖的最长路径以及指示去完成他们所需要的时间。

依赖关系图通常会在软件工程中使用或者IT技术中使用， 显示每个功能代码段或基础架构组件所依赖的内容。

调用图（Call graphs）(Multigraphs) 是依赖关系图的一种特殊类型， 展示了程序被调用的序列——静态（表示每一个可能的路径）， 或者动态代表了一个执行。 很多开发环境和编译器能够产生调用图， 你可以使用他们标识并安全的移除一些死代码或者精确找到无限循环的递归错误。

渲染依赖图是一个调度系统，它分析和优化视频数据的每一帧，以消耗更少的内存，提高图形api的性能。

拼图依赖图、叙事依赖图和导航图是游戏设计师和作家用来计划冒险和谜题游戏，以及编写书籍的工具，以确保他们的故事、谜题和世界不会过于线性，不会让用户感到无聊。

具有资源管理和生产链的游戏使用依赖关系图来约束研究和构建顺序，并允许AI“玩家”选择策略和分配资源。下面的例子展示了游戏《Satisfactory》中生产链的一部分，生产速度显示在连接器上。

技巧：在构建故事或谜题的依赖关系图时，请从最后开始并向后工作。

在drawio中创建依赖关系图

1. 去draw.io或者drawon.cn上创建一个流程图页面，一个空的就可以。
2. 双击画布， 选择一个椭圆形并添加到画布上。
3. 在节点上，选择四个方向的一个方向箭头， 选择一个图形，增加它到画布上，作为一个依赖。

技巧：如果你正在为一个软件程序创建一个依赖关系图，随着你添加更多的方法、库或组件，它会很快变得复杂。最好在开发早期就绘制这样的图表。

要记录现有的复杂系统，插入系统的文本描述并自动生成依赖关系图是更容易的。

依赖关系图模板

依赖关系图模板（PERT 程序）在drawio的模板库中的商业分类下可以找到。

1. 在在线版本的drawio或者drawon.cn的编辑器上， 可以点击Arrage> Insert > Template打开模板库对话框。
2. 在左边选择商务分类。 点击模板右上方的放大镜，可以看到更大的预览。
3. 选择一个模板， 点击Create 或者插入到画布上。

diagrams.net网站的依赖关系图

在Github网站的仓库中， 你可以看到网站的构建系统的依赖关系， 在Gemfile和Gemfile.lock清单文件中（在github网站，点击 insights> Dependency graph）。

点击箭头> 可以在github上展开它。 如果组件有多个依赖项，它们将在不同的组件下多次列出

可视化地理解这些依赖关系是如何相互关联的更容易，即使当您包含越来越多的依赖关系级别时，图表可能会变得非常繁琐，但是能够很容易的帮助你理解整个来龙去脉。

你知道吗？

GitHub开源软件项目可能会在存储库中显示依赖关系图。GitHub通过dependabot进行的依赖关系审查使用这些依赖关系图来分析新的依赖关系，并帮助您识别拉取请求中的潜在安全漏洞、不兼容的许可证和维护风险。

自动生成依赖关系图

有许多工具可以分析代码，并在Graphviz DOT图形描述语言中生成过程调用的文本描述。在draw.io或者drawon.cn中，你可以插入这些文本描述，并生成依赖关系图。

在下面的示例中，使用Gemfile中的前三个依赖级别来自动生成一个图。依赖关系图的文本描述列出了每个节点的所有传出链接，每行一个，如下所示:

www.diagrams.net-source->jekyll
jekyll->addressable
jekyll->colorator
jekyll->em-websocket
...

1. 点击 Arrange > Insert > Advanced > from Text. 可选的在工具栏上，点击”+ “ 图标， 选择高级。

2. 选择，从如下的大文本框中选择图表。

3. 将文本粘贴到大文本框中，然后单击“插入”以生成图表。现在可以对节点和连接器进行样式设置和重新排列。

Mermaid 依赖图： 你可以使用Mermaid语法插入一个依赖图。 点击 Arrange> insert > Advanced > Mermaid 打开Mermaid 输入框。

也可以使用电子表格插入依赖图：你也可以使用CSV文本来插入依赖图， 点击 Arrange > insert > advanced > CSV 可以看到 一个CSV数据和格式。

关于实践，你可以登陆drawon使用。