自从切换到mac之后,我一直在寻找一款趁手的流程图工具。遇到draw.io之后,我被这款工具的跨平台,适用场景广泛所吸引。直到它与vs code强强结合,使得它一举奠定在我心中最为优秀的流程图工具。本文就来介绍一款这款让人赞不绝口的流程图工具。
前言
之前,我一直是Visio的忠实用户,虽然桌面版、网页版流程图工具比比皆是,但是我还是坚持选择Visio。
直到切换mac之后,我不得不考虑找一款替代工具,
•OmniGraffle•edraw•...
要么收取高昂的费用、要么功能捉襟见肘。
无奈之下我开始考虑,是否有一些网页端的流程图工具?
其实,我第一时间想到的就是耳熟能详的ProcessOn。
不得不说,它的确很好用,功能不亚于很多商业桌面应用。
但是,ProcessOn有免费文件数量限制且仅能在网页使用,让我始终无法坚定的成为它的忠实用户。
最终,我把目光锁定在draw.io这款工具上面,使用一段时间之后的确觉得这是一款堪称良心的强大工具。
但是,让我单独写一篇文章介绍draw.io,我觉得它还过于单薄,所以,我一直在试用不同的类似工具,希望能够整理一个集合然后介绍给大家。
直到近期draw.io与vs code强强联合,顿时让我觉得眼前一亮。我觉得,draw.io加入vs code使得它顿时与其他同类工具拉开了差距,让它更加强大、与众不同。
本文,就来详细介绍一下这款值得大书特书的流程图工具吧!
draw.io
如果问draw.io最初吸引我的原因是什么?
其实很简单,
•免登录•完全免费•跨平台
免登录
我是一个很懒的人,虽然我很喜欢网页应用,但是大多数网页应用让我望而却步的主要原因之一便是需要登录。
我记不住数不清的账号密码,也不原因反复输入账号密码,对于工具,我更加倾向于开箱即用。
从这一点,draw.io与其他网页端流程图工具相比,胜出!
完全免费
![fde14ee2e9d6821d29077fb6df5e4352.gif](https://i-blog.csdnimg.cn/blog_migrate/fee87d88719894917717611fe39ba1f8.gif)
作为一款辅助工具,我是不会去付费购买流程图工具的。
虽然ProcessOn已经很好用,但是免费文件数量只有9张,这让我心里一直有一个心结。
从这一点,draw.io与其他网页端流程图工具相比,胜出!
跨平台
这是当初吸引我使用draw.io的3个原因中最为突出的一点。
虽然,网页端工具很好用,但是,没有网络怎么办?
这也是网页端应用相对于桌面应用最致命的缺陷之一。
draw.io在跨平台方面可以说是非常良心,你不仅可以在网页端使用,还可以下载安装到Mac和Windonws使用。也就是说,draw.io不仅可以在线使用,还可以离线使用。
从这一点,draw.io与其他网页端流程图工具相比,胜出!
除此之外,draw.io还可以在OneDrive、Google Drive、本地磁盘创建流程图,同时还可以加载来自Dropbox等网盘的流程图文件。
vs code插件
draw.io很好用,但是,在此之前它只是我无奈之下选择的替代品。
但是,随着draw.io开源vs code插件之后,它一跃成为我心中最强大的流程图工具,没有之一。
vs code应该不必多介绍,近几年来非常热门的一款开发工具,在很多开发者急需的功能方面做出很多改变,例如,远程开发、代码调试。
如果说vs code最大的优势在哪里,我觉得就是在于它丰富而实用的第三方插件方面。
code runner、local history、Partial Diff、TODO Tree、Better Comments...等众多优秀的第三方插件使得vs code如虎添翼。
有了这些vs code插件,我们可以在开发过程中听歌、快速执行代码、提升开发效率、书写文档。
那么,是否可以在vs code里画图?最好是流程图!
这是一个大胆的想法。
而,draw.io使得这个想法成为了现实,填补了这片空白!
vscode-draw.io插件开源不足两周,在GitHub已经4.6kstar,并在在vs code也有40k+下载,其火爆程度可见一斑。
的确,vscode-draw.io插件出现,不仅给这款流程图工具在适用场景方面进一步拓展,而且还使得原本复杂臃肿的流程图工具变得更加轻量化、简单易用。
使用
目前draw.io支持3中文件后缀,你只需要新建其中一个后缀结尾的文件就可以在vs code中画流程图,它们分别是,
•*.drawio•*.dio•*.drawio.svg
后续还会支持*.drawio.png,可以直接保存为常规图片格式,目前尚未发布。
drawio
![959b791d539ddb3b1aca7f6b3e5e4044.gif](https://i-blog.csdnimg.cn/blog_migrate/505f00fcdbdd684a905576e5a743f167.gif)
drawio.svg
![d1aac4e8a0668c7a608b92bf0b5e3ac5.gif](https://i-blog.csdnimg.cn/blog_migrate/d66f3e9c2600ebe9472245d79e7748a3.gif)
svg是一种矢量图形,基于xml开发,直接用代码来描绘图像,可以插入到文本中,例如GitHub README,另外,尺寸更小,且可压缩性更强。所以,近几年非常受欢迎。
另外,你可以使用文本编辑器打开drawio文件来编辑xml,这可以更加快速的创建或者编辑流程图。
Diagrams For Everyone, Everywhere
就如同它的口号一样,的确做到了2个难得的点,
•For Everyone•Everywhere
推荐阅读
•干货 | 2019年共享免费资源整理(上):学习资源篇•干货 | 2019年共享免费资源整理(下):实用工具篇•10款VS Code插件神器,第7款超级实用!
个人微信
欢迎各位同学添加我的个人微信,互相交流、互相学习,第一时间获得更多冷门好用的小工具!
![fb975ec079da3d7bf704efa293e26c5b.png](https://i-blog.csdnimg.cn/blog_migrate/bebc0e3f66b3b1fe477ad6f2a506c5bd.png)
我整理了10T+资源进行共享,其中包括实用工具、Python电子书、Spring视频教程、机器学习资源,扫码关注我的公众号“平凡而诗意”,后台回复相应关键字即可获得。除此之外,原创技术文章会第一时间推送,如果喜欢,麻烦点一下“在看”~
![81a48250ecfec9a684320ced4cbb87d9.png](https://i-blog.csdnimg.cn/blog_migrate/0c797392ba85c8fed3d54a3ec89e4128.png)