在线画时序图的工具:Web Sequence Diagrams ,支持实时生成预览图

蹲街弑〆低调 提交于 2019-12-09 10:03:06

因为工作需要,这两天在尝试着给手里壹些模块画时序图(Sequence Diagrams),壹般画这种图的时候,我们第壹反应会想到安装 IBM 的 Rational Rose,但是我不想为了画这种图就去安装壹個那麽庞大的企业级应用软件,不说使用的时候需要价格极其高昂的 License,就算使用盗版,也需要自己去网上到处找安装包,而公司的 WiFi 网络实在是太牵强,看看新闻查查 Google 还凑合,如果去用来下载几百兆的软件,那就等着吧,不过我手头的事情还得做,于是就想看看网上有没有在线画这种时序图的工具,搜了下,结果还真有,那就是 Web Sequence Diagrams

Web Sequence Diagrams 就是专门为画时序图而准备的,它的特点就是使用简单的编码来控制时序图的各個细节,非常轻便,非常简单,很容易上手。进入首页之后,默认的是壹個横向分成两栏的页面,左侧是文本编辑器,右侧是生成的时序预览图,左侧有壹竖栏是各种时序图组件,点击之后可以在编辑器里自动为你生成样例代码,修改修改就可以用了,并且右上角还有壹個下拉列表可以选择生成的时序图的样式,默认为 napkin,使用这种风格生成的时序图,其线条会不规则的扭来扭去,实际上就是手绘的草图,除此之外,还有:

1、Plain UML:白底黑字的标准时序图(推荐);
2、Rose:IBM Rational Rose 风格的时序图,橘黄色偏红的颜色(推荐);
3、qsd:文档报告中经常会用到的黑白时序图,各种组件四四方方的;
4、VS2010:微软 Visual Studio 风格的标准时序图,淡蓝色(推荐);
5、mscgen:把各個组件上的方框去掉了,只留下了文字的简化版时序图;
6、patent:线条加粗加黑的时序图(推荐);
7、napkin:线条不规则的扭来扭去,实际上就是生成了壹個手绘的时序图;

此处还有其它几种风格,我没有尝试,写的是Colorful,估计生成的时序图颜色会比较绚丽。其中我比较喜欢的几种网络就是 Plain UML,Rose 和 VS2010 这三种风格,因为生成的图片是最符合规范的。按照页面提供的编码方式,我也尝试着为手里的壹個功能模块画了個简单的时序图,其代码也非常有特点,使用正号(+)、负号(-)和左箭头(->)来表示每個流程的执行顺序。具体如下:

title XXX业务的时序图

View->+IService: 发送请求
IService->+ServiceImpl: 服务层处理
ServiceImpl->+Logic:逻辑层处理
Logic->+Dao:持久层处理

Dao->+xxx-sqlMap.xml: 调用指定的SQL语句1
note right of xxx-sqlMap.xml: 与数据库交互1
xxx-sqlMap.xml->-Dao:与数据库交互完毕返回1

Dao->+xxx-sqlMap.xml: 调用指定的SQL语句2
note right of xxx-sqlMap.xml: 与数据库交互2
xxx-sqlMap.xml->-Dao:与数据库交互完毕返回2

Dao->-Logic:持久层交互完毕返回
Logic->-ServiceImpl: 逻辑层交互完毕返回
ServiceImpl->IService: 服务层交互完毕返回
IService->-View: 请求处理完毕,返回页面
因为我個人比较偏爱 IBM Rational Rose 风格,所以也单独生成了该风格的图片。

对了,点击右上角的超链接[Link to this image]可以把生成的图片下载下来,页面会先弹出壹個提示框,询问是否成为付费用户,不用理会,直接点击提示框中的超链接[Open in new tab]就可以在新的选项卡中看到生成好的时序图了。

这個服务对于我这种偶尔需要画画时序图的人而言,真是太方便了,完全不用安装盗版的 IBM Rational Rose,而且还完美的实现了我想要的功能。当然,如果你觉得这個服务对你很有意义,并且愿意长期使用的话,那麽付费支付下也是非常推荐的,因为付费帐户会有更多的功能特性可以使用。另外,强烈建议在 Google Chrome 浏览器下使用该服务,页面刷新时会相比 Firefox 流畅,至于微软的 IE 浏览器,只能呵呵了。

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!