1. 产品
  2.   图表
  3.   JavaScript
  4.   JS-Sequence-Diagrams
 
  

用于 UML 序列图的开源 JavaScript API

通过开源免费 JavaScript 库将简单文本转换为 UML 序列图。

JS-Sequence-Diagrams 使软件开发人员能够通过开源 JavaScript 库从简单文本生成 UML 序列图。序列图显示了开发中涉及的对象和类以及对象之间交换消息的顺序。该库使用 Jison 解析文本,使用 Snap.svg 绘制图像。

它从图表的文本表示中绘制简单的 SVG 序列图。该库包括两种渲染图表的样式,“普通”和“手绘”。为 SVG 图表定制提供了几个 CSS 类。

Previous Next

JS序列图入门

安装 JS 序列图的推荐方法是运行 bower;安装 bramp/js-sequence-diagrams 并包含以下脚本:

通过 bower 安装 JS 序列图

 <script src="/{{ bower directory }}/bower-webfontloader/webfont.js" />
<script src="/{{ bower directory }}/snap.svg/dist/snap.svg-min.js" />
<script src="/{{ bower directory }}/underscore/underscore-min.js" />
<script src="/{{ bower directory }}/js-sequence-diagrams/build/sequence-diagram-min.js" />

另外,如果您打算使用手绘主题,请导入 CSS:

从简单文本生成 UML 序列图

JS 序列图库使软件开发人员能够从简单的文本生成 UML 序列图。该库允许您添加图表标题并在多个参与者上放置注释。最新版本使用 Snap.svg 和 Raphaël 绘制图表。 Snap.svg 是一个纯 SVG 实现,允许使用 CSS 样式、更好的字体支持、动画等。

通过 JavaScript API 将图表导出为 SVG

JS 序列图提供了通过开源 JavaScript API 将图表导出到 SVG 的功能。创建图表后,API 允许用户以 SVG 格式将其下载到他们选择的位置。 JS 序列图包含几个重要的 CSS 类,在使用 snap.svg 时可以应用于 SVG 图表。它包括用于应用到主要 SVG 标签的序列类、用于图表标题的标题类、用于应用到参与者的参与者类、用于所有注释的注释类以及用于应用到信号的信号类。

 中国人