mermaid语法如何指定节点方向

Question

左边的流程图是通过mermaid语法生成的，右边是drawio画出来的。请问下左边流程图怎么做到跟右边样式一致呀，全部垂直的不好看。
左边语法：

graph TD
                A[Lamp doesn't work] --> B{Lamp<br>plugged in?}
                B -->|No| C[Plug in lamp]
                B -->|Yes| D{Bulb<br>burned out?}
                D -->|Yes| E[Replace Bulb]
                D -->|No| F[Repair Lamp]

Answer 1

阿里嘎多学长整理AIGC生成，因移动端显示问题导致当前答案未能完全显示，请使用PC端查看更加详细的解答过程

mermaid 语法指定节点方向

你可以使用 rank 语句来指定节点的方向。例如：

graph TD
    A[L] -->|方向| B[R]
    rank = "LR"  // 设置节点方向为水平
    A -->> B

在上面的示例中，我们使用 rank 语句将节点的方向设置为水平（从左到右）。这样可以使得节点的方向与右边的 DrawIO 图形一致。

如果你想设置节点的方向为垂直，可以使用 rank 语句的 TB 或 BT 选项，例如：

graph TD
    A[L] -->|方向| B[R]
    rank = "TB"  // 设置节点方向为垂直，从上到下
    A -->> B

或者：

graph TD
    A[L] -->|方向| B[R]
    rank = "BT"  // 设置节点方向为垂直，从下到上
    A -->> B

这些语句可以帮助你控制 mermaid 生成的流程图的节点方向，以达到与 DrawIO 图形一致的效果。