html5 javascript工作流程图生成器[关闭]答案

【问题标题】：html5 javascript workflow diagram generator [closed]html5 javascript工作流程图生成器[关闭]
【发布时间】：2013-11-25 11:05:21
【问题描述】：

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

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

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

例如：

【问题讨论】：

【解决方案1】：

请通过 mxGraph (www.jgraph.com) ，它是 HTML5 / JavaScript 与 HTML 4 浏览器的后备。你可以在www.draw.io看到一个使用该技术的例子

【讨论】：

【解决方案2】：

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

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

对于工作流可视化，Sugiyama Layout 的自动布局算法实现在需要自动排列更多工作流项时很有帮助：

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

披露：我为创建上述库的公司工作。在 SO 我不代表我的雇主，我的 cmets、想法和帖子都是我自己的。

【讨论】：

【解决方案3】：

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

我找到了一个，然后我可以制作流程图，在服务器上加载和保存数据。

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

1) 矩形内的富文本。

2) 能够自定义形状。

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

4) 适用于 Android、iOS、HTML5 浏览器。

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

MIT 许可。

【讨论】：

你好，你能提供一个简单的例子吗
SVG-Edit 是一个通用的基于 HTML5 网络的图表工具。我仍在对其进行编码，到目前为止还没有遇到任何障碍。我确实尝试了其他图表工具，发现它们并不令人满意。

【解决方案4】：

这是我的两分钱。

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

【讨论】：