共计 4285 个字符，预计需要花费 11 分钟才能阅读完成。
在平时的工作中，常常会遇到绘制时序图、流程图的需要。在要求不高的时候，咱们能够抉择 ProcessOn、Xmind 这类工具来绘制，但有时候用代码来画图可能会更高效一点，毕竟没有比程序员更相熟代码的了。明天给大家举荐一款画图工具 PlantUML，能够配合 IDEA 应用，画图也更高效！
一、PlantUML 简介
lantUML 是一款开源的 UML 图绘制工具，反对通过文原本生成图形，应用起来十分高效。能够反对时序图、类图、对象图、流动图、思维导图等图形的绘制。上面是应用 PlantUML 来绘制一张流程图，能够实时预览，速度也很快！
二、装置
在 IDEA 中装置 PlantUML 插件的形式和其余插件的装置形式差不多。首先，在 IDEA 的插件市场中搜寻 PlantUML，而后进行装置即可。
当然，在网络不好的时候，咱们也能够点击 Plguin homepage 按钮拜访插件主页，而后下载到本地进行装置。
三、应用
接下来，咱们看看如何应用 PlantUML 插件绘制时序图、用例图、类图、流动图、思维导图，以及它们的一些应用技巧。
3.1 时序图
时序图（Sequence Diagram），是一种 UML 交互图。它通过形容对象之间发送音讯的工夫程序显示多个对象之间的动静合作。通常，在零碎的 Oauth2 的时候，第一步就是须要搞懂 Oauth2 的流程，这时候有个时序图就十分必要。上面咱们应用 PlantUML 来绘制 Oauth2 中应用受权码模式颁发令牌的时序图。
首先，咱们须要新建一个 PlantUML 文件，抉择时序图，如下图所示。
接下来，咱们能够通过 PlantUML 提供的语法来生成 Oauth2 的时序图。
@startuml
title Oauth2 令牌颁发之受权码模式
actor User as user
participant "User Agent" as userAgent
participant "Client" as client
participant "Auth Login" as login
participant "Auth Server" as server
autonumber
user->userAgent: 拜访客户端
activate userAgent
userAgent->login: 重定向到受权页面 +clientId+redirectUrl
activate login
login->server: 用户名 + 明码 +clientId+redirectUrl
activate server
server-->login: 返回受权码
login-->userAgent: 重定向到 redirectUrl+ 受权码 code
deactivate login
userAgent->client: 应用受权码 code 换取令牌
activate client
client->server: 受权码 code+clientId+clientSecret
server-->client: 颁发拜访令牌 accessToken+refreshToken
deactivate server
client-->userAgent: 返回拜访和刷新令牌
deactivate client
userAgent--> user: 令牌颁发实现
deactivate userAgent
@enduml而后，在 IDEAL 面板的左边就会对应的生成如下时序图，是不是很炫酷。
时序图有一些重要的参数阐明如下：
- title 能够用于指定 UML 图的题目；
- actor 能够申明人形的参与者；
- participant 能够申明一般类型的参与者；
- as 能够给参与者取别名；
- -> 能够绘制参与者之间的关系，虚线箭头能够应用 –>；
- 在每个参与者关系前面，能够应用: 给关系增加阐明；
- autonumber 咱们能够给参与者关系主动增加序号；
- activate 和 deactivate 能够指定参与者的生命线。
并且，当咱们右键时序图时还能够生成一个在线拜访的链接，如下图。
间接拜访这个链接就能够在线拜访 UML 时序图并进行编辑。
3.2 用例图
用例图（Usecase Diagram）是用户与零碎交互的最简示意模式，次要用于展示用户和与他相干的用例之间的关系。通过用例图，咱们能够很不便地示意出零碎中各个角色与用例之间的关系。
首先，咱们须要新建一个 PlantUML 文件，抉择用例图（Use Case）即可，如下所示。
@startuml
left to right direction
actor Guest as g
package Professional {
actor Chief as c
actor "Food Critic" as fc
}
package Restaurant {
usecase "Eat Food" as uc1
usecase "Pay For Food" as uc2
usecase "Drink" as uc3
usecase "Review" as uc4
}
g--> uc1
g--> uc2
g--> uc3
fc--> uc4
@enduml不过，运行的时候，呈现了如下图所示的谬误。
这个起因是因为没有装置 Graphviz，此时只须要装置 Graphviz 即可，装置的命令如下。
brew install Graphviz
用例图有一些参数阐明如下
- left to right direction 示意按从左到右的程序绘制用例图，默认是从上到下；
- package 能够对角色和用例进行分组；
- actor 能够定义用户；
- usecase 能够定义用例；
- 角色和用例之间的关系能够应用 –> 来示意。
3.3 类图
类图（Class Diagram）能够示意类的动态构造，比方类中蕴含的属性和办法，还有类的继承构造。
首先，咱们须要新建一个 PlantUML 文件，抉择类图，如下所示。
@startuml
class Person {
# String name
# Integer age
+ void move()
+ void say()}
class Student {
- String studentNo
+ void study()}
class Teacher {
- String teacherNo
+ void teach()}
Person <|-- Student
Person <|-- Teacher
@enduml而后，就能够看到代码生成如下类图。
类图有一些要害参数的阐明如下：
- class 能够定义类；
- 在属性和办法右边加符号能够定义可见性，- 示意 private，# 示意 protected，+ 示意 public；
- 通过 <|– 示意类之间的继承关系。
3.4 流动图
流动图（Activity Diagram）通常用于示意业务流程，比方电商中的下单流程，例如电商我的项目中购物车中生成确认单的流程。
首先，咱们须要新建一个 PlantUML 文件，抉择流动图，而后增加如下流程控制代码。
@startuml
title 生成确认单流程
start
: 获取购物车信息并计算好优惠;
: 从 ums_member_receive_address 表中 \n 获取会员收货地址列表;
: 获取该会员所有优惠券信息;
switch(依据 use_type 判断每个优惠券是否可用)
case(0)
: 全场通用;
if (判断所有商品总金额是否 \n 满足应用终点金额) then (否)
: 失去用户不可用优惠券列表;
stop
endif
case(-1)
: 指定分类;
if (判断指定分类商品总金额 \n 是否满足应用终点金额) then (否)
: 失去用户不可用优惠券列表;
stop
endif
case(-2)
: 判断指定商品总金额是否满足应用终点金额;
if (判断指定分类商品总金额 \n 是否满足应用终点金额) then (否)
: 失去用户不可用优惠券列表;
stop
endif
endswitch
: 失去用户可用优惠券列表;
: 获取用户积分;
: 获取积分应用规定;
: 计算总金额，流动优惠，应酬金额;
stop
@enduml而后该代码将生成如下流动图，在流动图中咱们既能够用 if else，又能够应用switch，甚至还能够应用while 循环。
流动图有如下的一些阐明如下：
- start 和 stop 能够示意流程的开始和完结；
- : 和; 两头增加文字来定义流动流程节点；
if+then+endif定义条件判断；switch+case+endswitch定义 switch 判断。
3.5 思维导图
思维导图（Mind Map），是表白发散性思维的无效图形工具，它简略却又很无效，是一种实用性的思维工具。
首先，咱们须要新建一个 PlantUML 文件，抉择思维导图。
@startmindmap
+[#17ADF1] mall 学习路线
++[#lightgreen] 举荐材料
++[#lightblue] 后端技术栈
+++_ 我的项目框架
+++_ 数据存储
+++_ 运维部署
+++_ 其余
++[#orange] 搭建我的项目骨架
++[#1DBAAF] 我的项目部署
+++_ Windows 下的部署
+++_ Linux 下应用 Docker 部署
+++_ Linux 下应用 Docker Compose 部署
+++_ Linux 下应用 Jenkins 自动化部署
--[#1DBAAF] 电商业务
---_ 权限治理模块
---_ 商品模块
---_ 订单模块
---_ 营销模块
--[#orange] 技术要点
--[#lightblue] 前端技术栈
--[#lightgreen] 进阶微服务
---_ Spring Cloud 技术栈
---_ 我的项目部署
---_ 技术要点
--[#yellow] 开发工具
--[#lightgrey] 扩大学习
@endmindmap
3.6 部署图
部署图 (deployment diagram，配置图) 是用来显示零碎中软件和硬件的物理架构。从部署图中，您能够理解到软件和硬件组件之间的物理关系以及解决节点的组件散布状况。应用部署图能够显示运行时零碎的构造，同时还传播形成应用程序的硬件和软件元素的配置和部署形式。
@startuml
actor actor
agent agent
artifact artifact
boundary boundary
card card
cloud cloud
component component
control control
database database
entity entity
file file
folder folder
frame frame
interface interface
node node
package package
queue queue
stack stack
rectangle rectangle
storage storage
usecase usecase
@enduml
尽管，目前能够绘制 UML 图的图形化工具很多，然而对于程序员来说，应用代码来绘图可能更间接。上文只列举一些常见的图场景，如果对 PlantUML 感兴趣，能够参考 PlantUML 中武官网
