如何将UML图表集成到GitLab或GitHub中

Question

我想在公共可用的存储库中发布一些编程文档.本文档包含格式化文本,一些UML图表和大量代码示例.我认为GitHub或GitLab是发布这个的好地方.

要发布UML图表,我想有一些简单的方法将它们更新到存储库中,并在wiki中作为图像显示.我不想将图表保存在我的计算机(或云端)中,编辑它们,生成图像,然后每次都将其发布.

有没有办法将图表放在存储库中(在PlantUML语法中是理想的),将它们链接在降价文本中,并在每次更新图表时使图像自动更新？

Answer 1

在尝试了另一个答案后,我发现该服务很慢,似乎没有达到最新版本的PlantUML.

我发现了一种不太直接的方式,但它可以通过PlantUML.com的服务器(在云端)工作.因此,它应该可以在任何可以热链接到图像的地方工作.

它利用了这个!includeurl功能,本质上是一个间接.markdown文件链接到包含图表源的PlantUML源.此方法允许在GitHub中修改源,GitHub markdown文件中的任何图像都将自动更新.但是,创建间接URL需要一个棘手的步骤.

1. 获取原始PlantUML源的URL,例如,https://raw.githubusercontent.com/linux-china/plantuml-gist/master/src/main/uml/plantuml_gist.puml(使用joanq的答案中的示例)

2. 转到http://plantuml.com/plantuml/form(或PlantText.com)并创建一个使用该!includeurl URL-TO-RAW-PLANTUML-SOURCE-ON-GITHUB操作的单行PlantUML源.继续使用示例URL,PlantUML(meta)源是:

   !includeurl https://raw.githubusercontent.com/linux-china/plantuml-gist/master/src/main/uml/plantuml_gist.puml
   

3. 从PlantUML.com的图像中复制图像URL,例如http://plantuml.com:80/plantuml/png/FSfB2e0m303Hg-W1RFPUHceiDf36aWzwVEl6tOEPcGGvZXBAKtNljW9eljD9NcCFAugNU15FU3LWadWMh2GPEcVnQBoSP0ujcnS5KnmaWH7-O_kEr8TU并将其粘贴到您的GitHub markdown文件中.此网址不会更改.

   ![PlantUML model](http://plantuml.com:80/plantuml/png/3SNB4K8n2030LhI0XBlTy0YQpF394D2nUztBtfUHrE0AkStCVHu0WP_-MZdhgiD1RicMdLpXMJCK3TC3o2iEDwHSxvNVjWNDE43nv3zt731SSLbJ7onzbyeF)
   

额外奖励:您甚至可以通过修改plantuml/png/URL 的部分来访问SVG格式,plantuml/svg/如下所示

![PlantUML model](http://plantuml.com:80/plantuml/svg/3SNB4K8n2030LhI0XBlTy0YQpF394D2nUztBtfUHrE0AkStCVHu0WP_-MZdhgiD1RicMdLpXMJCK3TC3o2iEDwHSxvNVjWNDE43nv3zt731SSLbJ7onzbyeF)

GitHub上的示例

https://github.com/fuhrmanator/course-activity-planner/blob/master/ooad/overview.md

编辑:替代代理服务

这种方式与上述答案明显不同且简单; 它使用PlantUML代理服务:

http://www.plantuml.com/plantuml/proxy?src=https://raw.github.com/plantuml/plantuml-server/master/src/main/webapp/resource/test2diagrams.txt

GitHub对此的降价将是:

![alternative text](http://www.plantuml.com/plantuml/proxy?src=https://raw.github.com/plantuml/plantuml-server/master/src/main/webapp/resource/test2diagrams.txt)

此方法无法指定SVG格式(默认为PNG),并且可能无法解决注释中提到的缓存错误.

Answer 2

这是一个古老的问题，但它在寻找此问题的解决方案的早期就出现了。

更新

GitLab 现在在其公开发行中同时支持Mermaid和 PlantUML 图。美人鱼开箱即用。

```mermaid
sequenceDiagram
Alice -> Bob: Authentication Request
Bob --> Alice: Authentication Response
Alice -> Bob:Another authentication Response
Bob --> Alice: Another authentication Response
```

例子

原答案

其他答案讨论了 GitHub，但值得注意的是，如果您在内部部署，GitLab 对此具有本机集成。出于某种原因，他们从未在公开募股中激活该功能。有门票打开以激活该功能。

如果您使用的是内部托管解决方案，则管理文档中提供了说明

基本上你

1. 建立你自己的 Plantuml 服务器
2. 检查Enable PlantUmlGitLab 服务器配置
3. 在你的 Markdown 中写上 PlantUml

```plantuml
Alice -> Bob: Authentication Request
Bob --> Alice: Authentication Response
   
Alice -> Bob: Another authentication Request
Alice <-- Bob: Another authentication Response
```

Answer 3

我发现在http://uml.mvnsearch.org/上使用plantuml-gist可以做到这一点

只需将有效的puml文件放在存储库中,并在文档中包含指向此站点的链接.

例如,对于GitHub中的文件https://github.com/linux-china/plantuml-gist/blob/master/src/main/uml/plantuml_gist.puml,您可以使用http://uml.mvnsearch.org /github/linux-china/plantuml-gist/blob/master/src/main/uml/plantuml_gist.puml作为链接.

以下是StackOverflow中链接的内容:

UML图像http://uml.mvnsearch.org/github/linux-china/plantuml-gist/blob/master/src/main/uml/plantuml_gist.puml

不幸的是,它似乎不适用于GitLab.我总是得到一个"找不到PUML文件",即使我已多次检查路径.

编辑:uml.mvnsearch.org上的服务器似乎失败了.