发布时间:2025-12-17
浏览次数:0
1 序言
在大家平常于工作里撰写文档之际,也就是所谓有着一图便胜千言的情况,常常都得绘制各类图示用以呈现中心思想,像是流程图啦,时序图嘿,还有UML图呢 。好多人会挑选Axure 、、(darw.io)、XMind、Visio、yEd、、Astah等这类软件去画图,这些软件具备功能丰富且可定制化程度高的特性,然而有时候却会致使使用者受限在软件所提供的素材范围之内,从而陷入靠着鼠标拖动来绘制图形的困境里,不知不觉就浪费了极为宝贵的时间 ;从另一方面来讲,鉴于安全合规方面的考量,在线绘图类的软件同样存在着数据隐私的风险 。
在此给大伙推荐一款把重点放在“画图”这一行为本身的工具,借由编写代码的途径达成契合各类需求情形的画图任务,让人们的精力高度汇聚于思想的呈现与传达,防止毫无意义的图形页面样式方面的修改变动,从而提高工作效率。
2 工具介绍
是一个可以快速编写 UML 图的开源组件(
创建于2009年,它支持多种UML图,像时序图、用例图、类图、对象图、活动图等,同时它还支持JSON数据、YAML数据、网络图、线框图形界面、架构图、甘特图、思维导图图示等。它采用GPL协议发布,在公司内部仅作为工具,在不分发不修改的前提下软件能够正常使用。 (https://.com//)。
这个图,不是像其他工具那样通过鼠标拖拽绘图方式绘制而成的图像而是被书写产出的图谱,它能够同时支持多种主题,在本地安装后便可使图形被渲染生成,其样式丰富具备可定制化的特性,并且文本格式方便保存、导入到git中从而能够实现历史记录的差异对比,最为要紧的是其学习成本非常低。
3 画图效果
下面展示使用 绘制的各种类型图例。
3.1 UML类图
3.2 活动图
3.3 流程图
3.4 时序图
3.5 脑图
4 各种主题
有 30 多种主题被内置了,去查看内置主题列表能借助 help 命令标点。
@startuml
help themes
@enduml
指令!theme 能够用于指定所需的主题名称,此操作可在文件开头进行。
@startuml
!theme mars
title 这是图的主题
header 页眉内容
footer 页脚内容
Alice -> Bob: 认证请求
Bob -> Bob: 认证处理
Bob -> Alice: 认证接受
@enduml
5 使用准备
对于各类平常会用到的开发软件予以支持,像是VS code,及其系列软件等等,在官网上也给予实时编辑这一支持;与此同时,对于通过命令行方式来生成图片同样是予以支持的。
5.1 VS code
安装插件:
查找并安装最新的插件,之后对于.puml 文件进行编辑工作,这样一来就能够实时地将图渲染出来 。
5.2 IDEA
安装插件:
搜索安装最新插件,然后编辑 .puml 文件即可实时渲染出图:
5.3
安装插件:
寻找到最新插件进行安装,之后对.puml 文件予以编辑,便能够实现实时渲染出图 。
5.4 命令行
从官网下载最新版 jar 包,然后执行如下命令:
# 解析 111.puml 文件并生成 png 图片
使用java,运行带有plantuml.jar的程序,针对111.puml进行操作 。
5.5 在线编辑
本地渲染即可满足使用要求,但是官网也支持在线模式。
6 语法简介
官网上有着丰富的 demo 能供参考,大体上满足了日常画图所需,在顶部点击导航栏能够查看各类图的帮助文档,于左侧导航栏那里提供了组件的特色设置项。
官网链接
6.1 时序图
能够运用关键字去定义UML元素,可以如此,举个例子,actor(也就是角色),还有(边界),以及(控制)intellij idea画uml图,再加上(实体),另外有(数据库),接着是(集合),queue(此为队列),借助as关键字来对参与者进行重命名,。
支持采用关键字,用以展开自动对消息编号,title关键字是用来给页面增添标题的。页面能够借助和显示页眉以及页脚。
利用这些关键词去组合消息:alt/else,opt,loop,par,break,group,随后紧接着消息内容,关键词end用以结束分组。分组是能够嵌套加以使用的。
6.2 用例图
定义一个包,as 定义对应别名, 定义用例,箭头定义关系。
6.3 类图
运用 class 去定义类,默认状况下会自行把属性以及方法分隔开来,并且也能够采用分隔符 --..==__. ,此分隔符之中还能够增添文字。
6.4 部署图
node用以标识节点,file用来标识文件,cloud对云进行定义,呈现出来的效果如同如下这般:
7 标准库
官方所提供的标准库给出了一串的图例扩展相关功能,它是依循 “C标准库约定” 的,借助命令:能够去查看当下版本组件支持的那个标准库。
可依据这些标准库,去创建丰富类型的图表,其中涵盖架构图,包含 AWS 部署图 ,还有 Azure 库等诸多类型 。
8 C4模型与.1 C4 模型
难道我们真的需要架构图吗?原因在于整个产品并非仅仅供开发人员使用,从开发人员开始,接着有测试人员,还有架构师,再是项目经理intellij idea画uml图,然后是产品经理,之后是UI交互设计师,最后是用户,这么多方人员,需要某一种方式方可把团队里每个人脑海中的架构化为可视化呈现,进而达成统一理解,此即架构图 。
C4模型是一种有关架构设计的方法论啊,它会忽略那些处在不同抽象层级之中的细节哟,进而得以更好地去进行表达以及可视化呀。它是软件系统建模方面的图形表示技巧呢。C4模型会运用一些已有的建模技巧哦,像统一建模语言(即UML)以及ER模型(也就是ERD)呀,它会把系统按照结构进行分解呢,分解成为容器( )还有组件( )。
能够进行类比的是地图,地图有着四个级别,分别是国家,省,市,街道;C4模型同样有四个层级,是依据其阶层关系对此进行分类的:
将上下文图( ),其中第一层的图,用来表明像系统、其使用者以及其他系统之间的关系 。
容器图,属于第二层的图,它会把系统分解为相互有关联的容器,这里的容器,既能够是应用程序,又能够是资料存储。
它作为第三层的图,是一种组件图,其作用是把容器划分成彼此相关的组件,同时此种图还能说明组件与其他组件,以及另外也可能是其他系统间的关系 。
4.有个叫代码图(Code )的图,它处于第四层,此图能提供架构元素的设计细节,并且还可以对应到程式码。在这一层级的 C4 模型会运用目前已有的标示方式,像统一建模语言、ER 模型或集成开发环境生成的示意图等。
有着五种基础图示元素,即人、软件系统、容器、组件和关系,C4模型的第一层到第三层会用到,这段文字没有规定元素方方面面,像是布局、形状、颜色或是风格,C4模型建议简单图表以嵌套框为基础,方便互动式协作绘图,C4模型也鼓励良好建模实务,比如在每一个图加上标题以及图例,还有清楚标示,为方便目标读者理解。
8.2
借助开源项目C4 - 能够达成软件模型图的制作,与此同时,官方标准库当中也涵盖了此组件。
@startuml "enterprise"
含有感叹号的,包含来自网址https://raw.githubusercontent.com/plantuml-stdlib/C4-PlantUML/master/C4_Container.puml的内容。
要包含,C盘下仓库文件夹里的C4 - PlantUML文件夹中的C4_Container.puml文件 ,是什么要求呀,这是某种语言特定操作指令吗,具体目的需要仔细考量下 。
!include
title 网银系统容器图
人物(顾客,那被称作客户的,有着这样的描述---“银行客户拥有属于自身的私人银行账号”)。
System_Boundary(c1, "网银") {
容器(网络应用程序, 网络应用, 编程语言为Java、框架为Spring MVC, 负责呈现传递静态内容以及网银单页面应用程序)。
容器,名为spa,其描述为单页应用,涉及JavaScript、Angular,通过浏览器向用户提供所有的网银功能 。
存在一个容器,其名为手机应用,它使用C#以及Xamarin,能够借助手机设备来提供具备有限性的网银功能。
ContainerDb,其中这个database嘛,它指代着“数据库”之所称呼的那个事物哟,而“数据库”呢,又属于“SQL数据库”,“SQL数据库”是干嘛的呢,它是用来存储用户的注册信息的范畴,不是一次性存储所有,而是随机地存储认证密码,还有访问日志等等等等这些东西呀。
容器,名为backend_api,其用途为API应用,所涉及技术为Java、Docker容器,具备通过API提供网银功能的特性 。
}
System_Ext,它针对的对象是邮件系统,而邮件系统属于网络软件交换系统这一范畴 。
将“Mainframe银行系统”存储关乎所有核心客户、账号以及事务的银行信息,这一行为应用于“banking_system”,并通过System_Ext来达成。
关联(客户, 网络应用程序, "运用", "超文本传输安全协议"),存在这样一种关联关系 ,其关联对象为客户与网络应用程序 ,关联动作是。
相关于(顾客,水疗馆,“使用”,“超文本传输安全协议”),。
涉及到,顾客,移动应用程序,是,“使用”这个关系!
建立关于网络应用程序与单页面应用程序之间的关系,这种关系是相邻的,并且涉及到“传输”这一行为 。
使Rel处于这样一种状态,即针对spa以及backend_api,存在着一种情况是,其涉及到“使用”行为,同时该行为具备“异步”的特性,并且在数据交互方面采用“JSON/HTTPS”方式。
关联(移动应用,后端应用程序编程接口,“运用”,“非同步,JavaScript对象表示法/超文本传输协议安全”)。
“Rel_Back_Neighbor”,针对“数据库”,关联“后端应用编程接口”,涉及操作类别为“读写”,同步方式为“同步”,且关联“Java数据库连接” 。
有关客户与邮件系统之间的关系,存在一种“发送邮件到”的限定,关联返回的那种关系,涉及客户,涉及邮件系统 。
与(电子邮件系统,后端应用程序编程接口,“发送邮件”,“简单邮件传输协议”)相关返回,,。
Rel,邻居,后端应用程序编程接口,银行系统,使用,同步或异步,可扩展标记语言或超文本传输安全协议,。
效果如下:
9 小结
运用格式良好、读起来顺畅的代码去展现图表,相较于别的工具,把注意力集中于画图这件事本身,用户只要依据规范撰写逻辑代码便能生成较为美观、整齐的图表,简便又高效。众人无需特意地去记住它的语法,在运用的进程中去查阅文档当作参考,很快便可上手。
最终,多谢你的阅览,要是此篇文章使你存有收获,同样欢迎你把它传导给更多的人士。
如有侵权请联系删除!
Copyright © 2023 江苏优软数字科技有限公司 All Rights Reserved.正版sublime text、Codejock、IntelliJ IDEA、sketch、Mestrenova、DNAstar服务提供商
13262879759
微信二维码