共计 3955 个字符，预计需要花费 10 分钟才能阅读完成。
1 序言
所谓一图胜千言，大家素日在工作中编写文档时，往往都须要画各种图来表白中心思想，比方流程图、时序图、UML 图，很多人抉择应用 Axure、PrecessOn、Diagrams（darw.io）、XMind、Visio、yEd、Lucidchart、Astah 等软件来画图，这些软件功能丰富可定制化强，然而有时候会让人局限在软件提供的素材中，陷入鼠标拖动绘制的泥潭，无形中节约了宝贵时间；另一方面出于平安合规思考，在线绘图类型的软件也存在数据隐衷危险。
在此为大家举荐一个专一于“画图”自身的工具 PlantUML，通过写代码的形式实现满足各种需要场景的画图工作，将人的精力集中到思维的表白与传递，防止无谓的图形页面款式批改调整，进而晋升工作效率。
2 工具介绍
PlantUML 是一个能够疾速编写 UML 图的开源组件（
https://github.com/plantuml/plantuml），始于 2009 年，反对时序图、用例图、类图、对象图、流动图等多种 UML 图，也反对 JSON 数据、YAML 数据、网络图、线框图形界面、架构图、甘特图、思维导图图示等。PlantUML 采纳 GPL 协定公布，在公司外部仅作为工具，不散发不批改的前提下软件能够失常应用。
相较与其余工具的鼠标拖拽绘图形式，PlantUML 的图不是“画”进去的，而是“写”进去的。PlantUML 同时反对多种主题，本地装置即可渲染出图形，款式丰盛可定制化，而且文本格式也便于保留到 git 实现历史记录 diff。最重要的是学习老本很低。
3 画图成果
上面展现应用 PlantUML 绘制的各种类型图例。
3.1 UML 类图
3.2 流动图
3.3 流程图
3.4 时序图
3.5 脑图
4 各种主题
PlantUML 内置了 30 多种主题，能够通过 help themes 命令查看内置主题列表。
@startuml
help themes
@enduml
在文件结尾能够通过指令 !theme 来指定须要的主题名称。
@startuml
!theme mars
title 这是图的主题
header 页眉内容
footer 页脚内容
Alice -> Bob: 认证申请
Bob -> Bob: 认证解决
Bob -> Alice: 认证承受
@enduml
5 应用筹备
PlantUML 反对各类罕用开发软件，比方 Eclipse、VS code、IntelliJ 系列软件等，官网上也反对实时编辑；同时也反对命令行形式生成图片。
5.1 VS code
装置插件：
搜寻装置最新插件，而后编辑 .puml 文件即可实时渲染出图：
5.2 IntelliJ IDEA
装置插件：
搜寻装置最新插件，而后编辑 .puml 文件即可实时渲染出图：
5.3 Eclipse
装置插件：
搜寻装置最新插件，而后编辑 .puml 文件即可实时渲染出图：
5.4 命令行
从官网下载最新版 jar 包，而后执行如下命令:
# 解析 111.puml 文件并生成 png 图片
java -jar plantuml.jar 111.puml
5.5 在线编辑
本地渲染即可满足应用要求，然而官网也反对在线模式。
6 语法简介
官网上（https://plantuml.com/zh/）提供了丰盛的 demo 可供参考，根本满足了日常的画图需要；顶部点击导航栏能够查看各种图的帮忙文档，左侧导航栏提供了组件的特色设置项。
6.1 时序图
能够应用关键字定义 UML 元素，如：actor（角色）、boundary（边界）、control（管制）、entity（实体）、database（数据库）、collections（汇合）、queue（队列），应用 as 关键字重命名参与者。
反对应用关键字 autonumber 用于主动对音讯编号，title 关键字用于为页面增加题目。页面能够应用 header 和 footer 显示页眉和页脚。
应用这些关键词来组合音讯：alt/else、opt、loop、par、break、critical、group, 前面紧跟着音讯内容，关键词 end 用来完结分组。分组是能够嵌套应用的。
6.2 用例图
package 定义一个包，as 定义对应别名，usecase 定义用例，箭头定义关系。
6.3 类图
应用 class 定义类，默认会主动将属性和办法宰割开，也能够应用分隔符 –..==__. 分隔符中也能够增加文字。
6.4 部署图
node 标识节点，file 标识文件，cloud 定义云，成果如下：
7 规范库
官网规范库提供了一系列的图例扩大性能，遵循“C 规范库约定”，应用命令：stdlib 即可查看以后版本组件反对的规范库。
基于这些规范库，能够创立丰盛类型的图表，包含但不限于架构图、AWS 部署图、Azure 库等等。
8 C4 模型与 C4PlantUML
8.1 C4 模型
为什么咱们须要架构图呢？这是因为整个产品不只是开发人员应用的，从开发，测试，架构师，项目经理，产品经理，UI 交互设计师，用户，这么多的人员，须要一种形式可能让团队的每个人脑子里的架构可视化进去，造成对立的了解，这就是架构图。
C4 模型一种架构设计的方法论，疏忽不在同一个形象层级的细节，从而能够更好的表白和可视化。是软件系统建模的图形示意技巧。C4 模型会用到一些现有的建模技巧，例如对立建模语言（UML）及 ER 模型（ERD），会将零碎结构化合成，合成为容器（container）和组件（component）。
能够类比地图，地图分 4 个级别，国家，省，市，街道；C4 模型也分 4 个层级，依其阶层关系分类：
1. 统上下文图（Context diagrams），第一层的图，阐明零碎、和其使用者以及其余零碎的关系。
2. 容器图（Container diagrams），第二层的图，将零碎合成为彼此相干的容器（container）。容器能够是应用程序或是材料存储。
3. 组件图（Component diagrams），第三层的图，将容器别离为彼此相干的组件，也阐明组件和其余组件（或是其余零碎）的关系。
4. 代码图（Code diagrams），第四层的图，提供架构元素的设计细节，能够对应到程式码。在此层级的 C4 模型会用到目前已有的标示形式，例如对立建模语言、ER 模型或是集成开发环境产生的示意图。
C4 模型的第一层到第三层，用到五种根底的图示元素：人、软件系统、容器、组件和关系。此技术没有规定元素的布局、形态、色彩或是格调。C4 模型倡议以嵌套框为根底的简略图表，不便互动式的合作绘图。C4 模型也激励良好的建模实务，例如在每一个图都加上题目以及图例，以及分明的标示，以不便指标读者的了解。
8.2 C4PlantUML
基于开源我的项目 C4-PlantUML 能够实现软件模型图制作。同时官网规范库里也包含了这个组件。
@startuml "enterprise"
'!include https://raw.githubusercontent.com/plantuml-stdlib/C4-PlantUML/master/C4_Container.puml'!include C:/repo/C4-PlantUML/C4_Container.puml
!include <C4/C4_Container>
title 网银零碎容器图
Person(customer, 客户, "银行客户有本人的私人银行账号")
System_Boundary(c1, "网银") {Container(web_app, "Web 利用", "Java, Spring MVC", "传递动态内容和网银 SPA")
Container(spa, "单页利用", "JavaScript, Angular", "通过浏览器对用户提供所有的网银性能")
Container(mobile_app, "手机利用", "C#, Xamarin", "通过手机设施提供无限的网银性能")
ContainerDb(database, "数据库", "SQL 数据库", "存储用户的注册信息，随机认证明码，拜访日志等")
Container(backend_api, "API 利用", "Java, Docker 容器", "通过 API 提供网银性能")
}
System_Ext(email_system, "邮件系统", "网络软件替换零碎")
System_Ext(banking_system, "Mainframe 银行零碎", "存储所有的外围客户，账号，事务银行信息")
Rel(customer, web_app, "应用", "HTTPS")
Rel(customer, spa, "应用", "HTTPS")
Rel(customer, mobile_app, "应用")
Rel_Neighbor(web_app, spa, "传输")
Rel(spa, backend_api, "应用", "异步, JSON/HTTPS")
Rel(mobile_app, backend_api, "应用", "异步, JSON/HTTPS")
Rel_Back_Neighbor(database, backend_api, "读写", "同步, JDBC")
Rel_Back(customer, email_system, "发送邮件到")
Rel_Back(email_system, backend_api, "发送邮件", SMTP")
Rel_Neighbor(backend_api, banking_system, "应用", "同步 / 异步, XML/HTTPS")
成果如下：
9 小结
PlantUML 应用格局良好且可读的代码来出现图表，相比于其余工具，PlantUML 将眼光聚焦到画图自身，用户只须要依据标准去写逻辑代码就能够生成比拟难看且整洁的图表，简略高效。大家不用刻意去记它的语法，在应用的过程中去查阅文档参考，很快就能够上手。
最初，感激你的浏览，如果这篇文章让你有所播种，也欢送你将它分享给更多的人。
作者：京东物流 高世雄
内容起源：京东云开发者社区
