在线画流程图、思维导图与架构图
写方案、写文档常需要一张图:业务流程图、系统架构图、思维导图、排期时间轴。为了画一张图去装一个大软件不划算——浏览器里拖出来就行,导出的还是矢量图。
11 类图,按场景挑
| 要画什么 | 用哪个 | 连线语义 |
|---|---|---|
| 处理步骤、判断分支 | 流程图 | 顺序 / 数据流 |
| 跨角色、跨部门流程(谁做什么) | 泳道图 | 流程箭头,节点限制在所属泳道内 |
| 客服分流、风控审批的判断路径 | 决策树 | 分支条件(默认"是/否"预设) |
| 工单流转、设备状态 | 状态图 | 状态转移 |
| 系统分层、部署拓扑 | 架构图 | 调用 / 数据流 / 依赖(虚线) |
| 数据库表结构与关系 | ER 图 | 关系基数 1:1、1:N、N:M |
| 类与继承关系 | UML 类图 | 继承、实现、组合、聚合 |
| 知识梳理、项目拆解 | 思维导图 | 分支线,中心主题左右分叉 |
| 团队层级、汇报关系 | 组织架构图 | 汇报线 |
| 项目里程碑、产品路线图 | 时间轴 | 先后顺序 |
| 接口调用时序 | 时序图 | 同步 / 异步 / 返回消息 |
从模板到成图(五步)
- 打开流程图制作(其他类型同理),顶部"载入示例模板"选一张接近需求的图,或从空白开始。
- 左侧"形状"里点一下,形状加到画布中央;拖动摆位置。
- 鼠标移到节点上,四边出现连接桩(小圆点),按住拖到另一个节点即连线——点中节点或连线,在左侧"属性"里改文字、字号、颜色、尺寸,连线还能改箭头类型。
- 布局乱了点"自动整理":按图型给不同算法(分层、树形、泳道成列、时间轴、时序网格),选错方案就在下拉里换;这是一次普通操作,撤销(Ctrl+Z)可以退回整理前。
- 点"导出 SVG"或"导出 PNG"(1×/2×/3×)下载;也可以"存档"留在浏览器里随时回来继续改。
常用快捷键:Delete 删除、Ctrl+Z 撤销、Ctrl+Shift+Z 重做、Ctrl+C/V 复制粘贴、Ctrl+A 全选;思维导图 / 组织架构图 / 决策树里,选中节点按 Tab 加子节点、Enter 加同级节点。把节点拖进泳道或分组框,它就成为其子节点,移动容器会带着子节点一起动。
导出与带走
- SVG(矢量,可再编辑):贴进文档、PPT 或交给设计;导出固定为内容尺寸,不内联页面样式,文件小且跨软件干净。
- PNG:白底,导出像素 =(内容尺寸 + 每边 12px 内边距)× 倍率。
- 导出数据(JSON):换设备/换浏览器前导出,回来"导入数据"继续改;"存档"只存在本浏览器,与账号无关,清理浏览器数据会一并清掉——重要内容请先导出 JSON。
规模上限与不做的事
- 单图最多 200 个节点、400 条连线;文字最长 200 字;ER 实体字段与 UML 属性每段最多 30 条;时序图最多 12 位参与者、80 条消息。
- 画布太大时 PNG 导出可能失败(浏览器 canvas 的位图上限,不是工具限制)——改用 SVG。
- 不支持:协作与云同步、插入图片、透明背景导出、导出 PDF;节点暂不支持旋转与自由缩放。
常见问题
导出的图能进 PPT 吗
可以。SVG 贴进 PPT、Word 都是矢量的,放大不糊;需要位图就用 2×/3× PNG。
中文换台电脑打开会不会变样
会略有差异:导出跟随本机系统字体渲染,别的机器上字形与换行可能和原稿不同。介意的话导出 PNG/SVG 后当图片用,不做二次编辑。
图数据存在哪,会丢吗
只存在你的浏览器本地(不上传、不经过服务器)。清理浏览器数据会清掉草稿与存档,重要内容先"导出数据"存 JSON 文件。
能多人协作编辑吗
不支持。当前定位是单人本地工具;需要协作时用"导出数据"传递 JSON,轮流编辑。
睿工具