@[TOC](draw.io 开源矢量图作图神器的骚操作)

初识 draw.io

draw.io 是一个开源免费的制图软件,是大学生必备的学习工具。draw.io 有网页版和软件版两种,其中网页版支持多种云盘存储,非常的方便。

我接触的第一个矢量作图软件是 InkScape,一个自由的矢量作图软件。但是对于我,矢量图的应用场景只有作流程图和UML图这种,这样自由的矢量图工具不适合我。然后我接触的金山文档的流程图制作,和 InkScape 不同的是金山文档的这个非常的局促,体现在以下几个方面:有限的矢量图形,仅限于金山的云盘存储,带水印的导出图片。

后来机缘巧合之下我的教授向我推荐了 draw.io 这个工具。开源免费、大量的可选图形、清新的界面设计一下子就吸引了我。在之后的使用中,我越发的认为已经不会有比这个工具更适合我的矢量作图工具了。

使用 draw.io 的日常

我已经使用了 draw.io 一年多了,主要有下面四个使用场景。

制图

最基本的就是制图。从流程图到UML,从内存图到神经网络,从UI设计到合作模型展示,draw.io 都可以胜任,都可以得到美观的输出图片。

计划流程

学习生活中总离不开计划安排,我们可以使用矢量作图工具很简单的设计流程。相较于其他的工具,draw.io 借助于快捷键和连线功能的特殊设计,可以更加便捷的完善流程之间的逻辑连接。除此之外,清新的设计风格和精心的主题设置,可以使杂乱的流程显得略微清晰。

TODO [放几张图,展示软件使用时候的特点]

整理逻辑

论文写作和日常的案例分析总离不开逻辑关系图的辅助。矢量图制图工具可以很清晰的把对象之间的逻辑关系展示出来,方便之后的写作。draw.io 拥有大量的自动化的辅助功能,可以快速构建庞大的逻辑图,让构图速度跟上思考速度。

TODO[放几张图,展示快捷节点生成]

开始逐渐离谱

完全文本格式粘贴

draw.io 兼容各种文本格式。虽然软件内部的文本格式设置比较有限,但是我们可以从其他的软件复制文本过来。比如我们复制一段 vs code 代码编辑器中的带高亮的 python 代码片段到 draw.io 中,高亮是会被完整保留下来的。在整理逻辑,尤其是学习其他人的代码逻辑的时候这个功能是非常实用的。

TODO[放几张图,展示代码格式]

变态高效快捷键

draw.io 秉承现代创作软件的设计风格,拥有大量的快捷键。熟练使用快捷键可以大幅度提高创作者的效率。最常用的快捷键就是 Ctrl + 鼠标拖动 可以快速复制元素,减少了从仓库拖拽图形元素的次数。

TODO[放两张图,一张展示快捷键,一张 gif 展示拖动操作]

超文本 HTML 支持

这一点是 draw.io 最大的特点,开发者可以把导出的 html 格式的矢量图嵌入到网页中。作为一个重度个人博客作者,利用网页模块快速并展现不同的内容和思想是重中之重。嵌入式的矢量图很完美的诠释了什么是优雅,什么是速度。相较于直接嵌入图片,这种嵌入 html 代码的方式能够实现图片源码的开源,方便读者或是其他的作者使用和修改。

TODO[放两张图片,展示html嵌入的方法]

主题?想怎么改就怎么改

  • 便利主题切换
  • 高级主题设置

参考/扩展