基于 Javascript 的 UML 图编辑器答案

【问题标题】：Javascript based UML diagrams editor基于 Javascript 的 UML 图编辑器
【发布时间】：2014-08-05 09:51:07
【问题描述】：

我正在寻找一个基于 HTML5/JS 的 UML 编辑器库，能够支持自定义 UML 编辑器开发，主要用于类图，最终用于包和组件图。

我的具体要求：

我已经看过其中的几个（GoJS、Jointjs 等），但希望了解所有可能的选项以及一些建议。

谢谢！

【问题讨论】：

-1 for stackoverflow.com/help/dont-ask 如果您想查看所有可能的选项，请使用 Google（lucidchart、GenMyModel、draw.io、yFiles for html，...）。对于某些相关建议，您的要求不够明确。什么是“自定义 UML 编辑器开发”？
你是对的 xmojmr，我绝对可以添加更具体的要求，我现在就做。当然，我已经用谷歌搜索过了，并做了一些初步调查，我只是想收到一些其他的想法。
可能与另一个题外话 stackoverflow.com/questions/6877121/… 重复。如果你联系作者，他们可能会给你他们的源代码，这样你就可以构建另一个在线 uml 编辑器

标签： html uml

【解决方案1】：

有一些库可以根据这些要求生成 UML 图。

JointJs core library 在 Mozilla Public License 下是开源的，这意味着您必须包含版权，但您可以将其用于商业目的。它依赖于 jQuery 3.1.1、Lodash 3.10.1、Backbone 1.3.3。（Rapppid 正在使用这个库）它提供了许多即用型图表元素，这些元素具有响应性和交互的。用户可以移动块、添加和删除关系以及关节，放大和缩小。
Draw2D 是用于创建 Visio 之类的绘图、图表或工作流的库。社区版差不多 5 欧元就可以买到。它确实提供了类似于 Visio 的块和图表，它们可以交互地调整大小、移动块和修改文本和关系，以及对块进行分组、放大和缩小。这可能是构建图形编辑器工具的不错选择。
mxgraph 是一个库构建一个像draw.io 这样的UML 编辑器。创建的块是交互式的，因此用户可以移动或调整块的大小阻止、修改文本、添加或删除关系。

gojs 是另一个商业图书馆，但它提供可用于学术目的的免费许可证。创建UML编辑器也是合适的选择，有许多现成的图表可用。创建块后，用户可以移动它们，修改文本和关系；以及其他不同图表的许多其他功能。
UmlCanvas by Christophe VG 作为 js 库，它提供来自文本信息的 UML 图。这些图表以您可以移动块的方式进行响应；关系线很聪明，可以保持设计的美观。但不止于此。
PlantUML 是一个 UML 工具，可以通过 jQuery 库（也可以使用其他语言的库）从文本信息中提供 UML 图表，但是图表没有响应性。
Raphaël 是一个小型 JavaScript 库，可以简化您在 Web 上处理矢量图形的工作。这不是创建图形编辑器的最佳工具，但它为简单的用户交互（例如移动和弯曲）提供了闪亮而漂亮的图表

还有其他库如：

它们为图表提供基本组件，但它们中的大多数没有内置编辑器的功能，例如拖放和块编辑。另一方面，开发人员可以创建不同的图表和绘图组件，这些库可以使用这些组件。它们可能不是为用户创建完全交互式和可编辑图表的最佳选择。

【讨论】：

【解决方案2】：

查看“jsUML2：用于 UML2 建模的 HTML5/javascript 库”。一个简短的介绍可以阅读here

【讨论】：

谢谢，我已经看过这个工具了。乍一看，它似乎很完整，但缺乏更好的可用性（例如它绘制关联的方式不是很好）和更多的拖放。不过，我仍然需要对其进行更多分析，看看扩展它有多复杂。
您可以随时尝试与主要开发人员取得联系，了解他们对该工具的计划。