如何使用美人鱼制作一堆盒子?

问题描述 投票:0回答:0

我正在编写一些将在 Github 上阅读的文档,我想使用 Mermaid 生成一些图表。

大部分流程图都是直截了当的,我可以效仿美人鱼的例子。不过,我在表达一种图表时遇到了一些麻烦。

我想在顶层盒子中嵌套一些盒子,结果如下所示:

    ---------------
    | My Main Box |
    |             |
    |  ---------- |
    |  |  Foo   | |
    |  ---------- |
    |  |  Bar   | |
    |  ---------- |
    |  |  Baz  |  |
    |  ---------- |
    ---------------

我一直在绞尽脑汁想出一个办法,但总是一无所获。我能得到的最接近的是:

    graph BT
        subgraph main[My Main Box]
        1[foo]---2[bar]
        2---3[baz]
        linkStyle default fill-opacity:0,stroke-width:0px,stroke-opacity:0
    end

很近,但内部盒子彼此距离太远。有没有什么办法可以缩短我的隐形连接器的长度,或者我可以用不同/更好的方式来表达这个图表?

javascript html github diagram mermaid
© www.soinside.com 2019 - 2024. All rights reserved.