html5 javascript工作流图生成器

Question

我正在寻找html5 javascript中的工作流生成器

我的系统具有多种状态，并且这些状态遵循可由用户更改的特定工作流程。

我正在寻找一个简单的框架，它将生成工作流的可视化表示

前：

• 从开始到处理
• 从解决方案到结束或从流程到结束
• 最后从解决方案到结束

Answer 1

请浏览mxGraph（www.jgraph.com），这是HTML5 / JavaScript，支持HTML 4浏览器。您可以在www.draw.io

中查看使用该技术的示例

Answer 2

如果您正在寻找更复杂的解决方案，那么在商业场景中，您可能需要考虑yFiles for HTML。如果您的系统非常简单，那么这可能会有点过分，而像jsPlumb这样的简单解决方案就足够了。

以前的库支持各种用户交互和自定义，并支持轻松集成自己的形状和可视化表示。

具体而言，对于工作流可视化，当需要自动安排更多工作流项时，Sugiyama Layout的自动布局算法实现很有用：

在上图中，添加了泳道，这在更复杂的工作流程图中非常常见。该算法可以自动排列形状，连接和泳道。您可以在this live sample application

中查看此操作

披露：我为创建该库的公司工作。因此，我不代表我的雇主，我的评论，想法和帖子都是我自己的。

Answer 3

我尝试了几种工作流程，流程图和图表工具。

我找到了一个我可以制作工作流程图，从服务器加载和保存数据的文件。

这几乎具有可用于制作工作流程图的所有功能：

1）矩形内的富文本。

2）能够自定义形状。

3）能够添加流程图符号并修复后端代码。

4）适用于Android，iOS，HTML5浏览器。

5）能够添加不同种类的线条以附加到不同的形状和对象。

麻省理工学院获得许可。

https://code.google.com/p/svg-edit/

Answer 4

这是我的两分钱。

如果您需要GPL和/或商业版，可以使用Draw2d.org lib。 它是一个SDK评估者而不是即用型应用程序。在这种情况下集成 或定制是可能的。

• 读/写JSON
• 写PNG或GIF
• ...