draw.io中绘制uml部署图需手动启用uml形状库,拖拽node、component等标准符号构建层级节点结构,将组件拖入节点内部表示部署位置,用dependency线和interface(棒糖形)表达依赖与接口契约,并添加文本框或note标注物理约束。

如果您希望在 draw.io 中绘制符合 UML 规范的部署图(即服务器部署架构图),需明确区分 draw.io 与 Visio 的操作逻辑:draw.io 不内置“UML 部署图”专用模板,但可通过手动组合标准形状与连接关系实现完全等效的部署图表达。以下是完成该任务的具体路径:
一、启用UML形状库并加载节点与组件元素
draw.io 默认未激活 UML 相关形状,需手动开启以获取符合 UML 2.5 标准的节点、组件、接口等图形,确保图表语义准确。未启用该库将导致无法使用标准化的“节点实例”或“棒糖接口”等关键符号。
1、打开 draw.io(网页版或桌面版),新建空白图表。
2、点击左上角 排列 → 插入 → 形状库,或直接按快捷键 Ctrl+Shift+L(Windows)/ Cmd+Shift+L(macOS)。
3、在弹出窗口中勾选 UML 和 AWS / Azure / GCP 等云服务图标(可选,用于物理服务器或云节点具象化),点击“确定”。
4、左侧形状栏将出现 “UML” 分组,其中包含 Node、Component、Artifact、Interface(棒糖形)、Package 等必需形状。
二、构建核心节点结构并设置层级关系
部署图的核心是节点(Node),代表物理设备或运行时环境;节点可嵌套以表达层级部署关系(如云区域→可用区→虚拟机)。必须使用“Node”形状而非普通矩形,以维持 UML 语义一致性。
1、从 UML 形状栏拖拽 “Node” 形状至画布,双击编辑名称,例如 “生产环境-华东1区”。
2、再次拖拽一个 “Node” 形状,将其完全拖入第一个节点内部——当出现 绿色半透明覆盖层 时松手,表示已建立容器关系。
3、对嵌套节点重命名为 “Web服务器集群”,并调整其大小使其完整容纳于父节点内。
4、重复步骤2–3,添加第三层节点如 “Nginx实例-01”,构成三级物理拓扑。
三、部署组件与对象到指定节点
组件(Component)代表可执行软件单元(如微服务、数据库引擎),对象(Object)代表运行时实例(如 Session 对象)。二者必须置于节点内部,以显式声明部署位置,不可仅用连接线关联。
1、从 UML 形状栏拖拽 “Component” 形状,直接拖入最底层节点(如“Nginx实例-01”)内部,等待 绿色吸附提示 后释放。
2、双击该 Component,输入名称 “nginx:alpine-v1.24”,并在下方属性面板中点击 “样式” → “标签” 添加版本注释。
3、拖拽 “Artifact” 形状(代表部署包,如 WAR/JAR 文件)至同一节点内,命名为 “auth-service.jar”。
4、若需表示运行时对象,拖拽 “Object” 形状放入节点,命名为 “UserSession@20260425”。
四、建立组件间依赖与接口绑定
依赖关系(Dependency)体现组件调用链,接口(Interface)定义契约。UML 要求依赖箭头指向提供方,且接口必须通过“棒糖”或“插座”形式显式附着,不可仅用文字标注。
1、从 UML 形状栏拖拽 “Interface”(棒糖形) 至画布空白处,双击命名 “UserServiceAPI”。
2、选中该 Interface,右键选择 “显示为类状的界面” 以展开操作列表(如 login()、logout())。
3、从 “auth-service.jar” 组件向 “UserServiceAPI” 拖拽连接线,松手时选择 “Dependency” 样式(虚线+开放箭头)。
4、再从 “nginx:alpine-v1.24” 组件向同一 Interface 拖拽另一条 Dependency 线,完成双向契约声明。
五、添加物理标识与部署约束说明
真实部署图需注明硬件规格、网络分区、安全域等非功能约束。draw.io 支持通过文本框与标注形状补充此类信息,但必须与节点/组件保持空间隶属关系,避免游离标注。
1、右键点击任一节点(如“Web服务器集群”),选择 “编辑样式”,在弹出框中追加 html=1;strokeColor=#000000;fillColor=#ffffff;fontSize=12; 并确认。
2、在节点右下角空白处插入文本框(快捷键 T),输入 “CPU: 8C/16G | OS: Ubuntu 22.04 LTS”,拖动至节点边缘对齐。
3、使用 “Note” 形状(位于通用形状栏)标注安全约束,例如 “DMZ 区域,仅开放 443/80 端口”,并将 Note 形状用虚线连接至对应节点边界。











