改字、调布局、修报错

先在编辑器里打开这段带一处错误的代码，边看边试：

flowchart LR
    A[用户下单] --> B{库存充足?}
    B -- 是 --> C[扣减库存]
    B -- 否 --> D[提示缺货]
    C --> E[创建订单]
    E --> F[支付]
    F --> G([完成])

改文字：双击节点

预览里双击一个节点，节点上出现输入框，改完回车生效，Esc 取消。改动会直接回写到左边的代码——代码仍然是唯一的真相，导出、分享链接、云端保存看到的都是改过的代码。目前流程图和思维导图支持双击改字，其他图类型在代码里改。

改方向和间距：「布局」

预览上方的「布局」按钮（手机在「主题」面板底部）只对流程图有效：

• 方向：上→下、左→右、下→上、右→左，改的是第一行 flowchart TD 里的方向。汇报里放横版的图，切「左→右」最常用。
• 节点间距 / 层间距：两条滑杆，写进代码顶部的 %%{init: …}%% 一行；「恢复默认」会把它去掉。

因为改的是 Mermaid 原生语法，把代码贴到任何支持 Mermaid 的地方都会得到同样的布局。想拖着节点摆位置，Mermaid 语法里没有坐标，用自由画布。

加环节、换形状：改代码

最常改的几处，照着写就行：

• 加一步：在两个节点之间插一行，C --> C2[校验地址] 再 C2 --> E，同时删掉原来的 C --> E。
• 连线上的文字：B -- 是 --> C，或者 B -->|是| C。
• 节点形状：[方框]、(圆角)、([体育场形，常用作开始 / 结束])、{菱形，判断}、[(圆柱，数据库)]、((圆))。
• 文字里有括号或引号：整段用双引号包起来，A["登录(手机号)"]，否则会报「括号没有闭合」。
• 换行：节点文字里写 <br>。
• 分组：subgraph 名称 … end，泳道图就是这么画的，见用 AI 画流程图。

改完不用点任何按钮，0.5 秒内自动重新渲染。

代码报错了

代码有语法问题时，预览保留上一次成功的图，编辑器下方的报错条用中文说明原因并标出行号：

• 点「跳到第 N 行」直接定位；编辑器里那一行也有标记。
• 点「查看常见报错 →」跳到帮助中心对应的说明，每种报错都有例子和改法。
• 点「AI 修复」：当前代码和报错信息会发给 AI 引擎处理一次，回来先在你的浏览器里试渲染一遍，再把逐行改动对比给你看，你决定采纳还是放弃。免费额度每天 5 次。

AI 回复里最常见的几种错：-> 写成了流程图的箭头（应为 -->）、end 当了节点名、中文括号出现在语法位置、subgraph 缺 end。报错条会点名是哪一种。

试试把上面那段代码里的某个 --> 改成 ->，看报错条怎么说，再点「AI 修复」。

不想碰代码：AI 美化

代码能正常渲染时，状态行「已识别：流程图」旁边有「AI 美化」。它不改图的含义、不增删步骤、不写任何配色，只整理写法：按语义换形状（开始 / 结束用圆角，判断用菱形）、按图的形状选方向、明显同属一个阶段的步骤分组、太长的文字换行。结果同样先给你看改动对比。和修复共用每天 5 次的免费额度。

接下来

• 上一篇：怎么让 AI 给出能直接渲染的代码
• 下一篇：导出到 Word、PPT、PDF
• 每种报错怎么改：常见报错怎么改