组件与服务
使用 component 或方括号声明组件，并为 API、后台服务、前端模块和数据库使用稳定且清晰的名称。
PlantUML 组件图在线编辑器
在线创建 PlantUML 组件图，展示服务、模块、接口和依赖关系，实时预览并导出 PNG 或 SVG。
PlantUML 组件图在线编辑器工作区
从中文组件图模板开始，编辑 PlantUML 源码并实时查看渲染结果。
使用轻量编辑器快速预览。需要 AI 生成、语法修复或项目协作时，请打开完整编辑器。
图表预览
使用 PlantUML 创建组件图
在可编辑工作区中设计组件、服务、模块、接口、端口、数据库、依赖和系统边界，无需安装 Java 或 Graphviz。
内置组件图模板
从可直接渲染的中文组件图示例开始。
实时图表预览
编辑 PlantUML 源码时同步检查图表结构与标签。
专属语法说明
学习组件、服务、模块、接口、端口、数据库、依赖和系统边界的常用表达方式。
PNG 与 SVG 导出
从同一份源码下载适合分享或文档使用的图表。
如何在线创建 PlantUML 组件图
使用内置模板创建适用于软件架构、微服务地图、模块依赖、集成设计、部署准备和系统文档的组件图。
- 01
打开内置组件图模板。
- 02
为服务、模块和数据库命名。
- 03
添加提供或需要的接口与依赖方向。
- 04
按系统边界或职责对组件分组。
- 05
检查架构并导出图表。
PlantUML 组件图语法与应用场景
学习组件图的核心语法与建模方法，并直接在上方编辑器中应用。
接口与依赖
使用 interface 声明契约，通过箭头表达组件依赖方向，并在连线上标注协议或用途。
边界与分组
使用 package、node、cloud 或 rectangle 对相关组件分组，表达系统、团队或部署边界。
什么时候使用组件图
当重点是运行时组件、服务接口和依赖关系时使用组件图；类级结构应使用类图，交互顺序应使用时序图。
PlantUML 组件图中文示例
编辑示例源码，检查实时预览，并按需导出 PNG 或 SVG。
@startuml
[前端] as 前端
[API 网关] as 网关
database "订单数据库" as 数据库
前端 --> 网关 : HTTPS
网关 --> 数据库 : 读写数据
@enduml相关 PlantUML 工具
需要其他导出格式或完整 PlantUML 编辑流程时，可以使用这些相关工具。
为什么使用 PlantUML 创建组件图
PlantUML 将组件图保存为可审阅文本，便于更新、版本控制、复用和导出。
从正确模板开始
直接使用组件图模板，无需改造无关示例。
让模型便于评审
使用可读文本保存设计，适合文档和版本控制。
导出前检查结果
在分享之前检查图表结构、关系和标签。
常见问题
什么是 PlantUML 组件图在线工具？
这是一个从组件图模板开始的浏览器编辑器，可编辑源码、实时预览并导出 PNG 或 SVG。
组件图适合哪些场景？
常见场景包括软件架构、微服务地图、模块依赖、集成设计、部署准备和系统文档，可以根据实际系统替换内置示例。
如何在 PlantUML 组件图中表示接口？
使用 interface 声明接口，并通过依赖箭头连接提供或使用该接口的组件。
组件图适合描述微服务吗？
适合。可以将每个服务建模为组件，并标注 API、事件流、数据库和外部依赖。
可以把组件图导出为 PNG 或 SVG 吗？
可以。PNG 适合演示文稿和快速分享，SVG 适合需要缩放的网页与技术文档。
需要安装 PlantUML、Java 或 Graphviz 吗？
不需要。在线工具通过服务端生成预览，可以直接在浏览器中编辑和导出。
需要 AI 辅助编辑吗？
打开 OnUML 完整编辑器，使用 AI 生成、语法修复、分享和项目管理。