benweet / stackedit

In-browser Markdown editor
https://stackedit.io/
Apache License 2.0
21.49k stars 2.7k forks source link

[Bug] Unable to render mermaid directional subgraph #1764

Open grashaar opened 2 years ago

grashaar commented 2 years ago

The following graph will be rendered correctly IF we remove "direction" line from the subgraphs.

flowchart TB
    classDef classEnd fill:#ff0000,color:#fff;
    classDef classSignal fill:#00FA9A;

    subgraph Logic_A
        direction LR
        AA --> AB
        AB --> AC
        AC --> AD
        AD --> AE:::classSignal
    end
    subgraph Logic_B
        direction TB
        BA --> Logic_B_A
        subgraph Logic_B_A[ ]
            direction LR
            BB --> BB_D{Success}
            BB_D --> |True| BCallback:::classSignal
            BB_D --> |False| BC
            BC --> BC_D{Success}
            BC_D --> |True| BCallback
            BC_D --> |False| BD
            BD --> BD_D{Success}
            BD_D --> |True| BCallback
            BD_D --> |False| BEnd[END]:::classEnd
        end
    end
    subgraph Logic_F
        direction LR
        FA --> FB
        FB --> FC:::classSignal
    end
    subgraph Logic_C
        direction LR
        CC --> CE
        CE --> CE_D{Success}
        CE_D --> |True| CF:::classSignal
        CE_D --> |False| CG:::classSignal
    end
    subgraph Logic_D
        direction TB
        DA --> DB
    end
    subgraph Logic_E
        direction TB
        EA --> EB
        EB --> EC_D{Success}
        EC_D --> |True| ED
        EC_D --> |False| EEnd[END]:::classEnd
        ED --> EE:::classSignal
    end
    Logic_A --> Logic_B
    Logic_B --> Logic_F
    Logic_F --> Logic_C
    Logic_C --> Logic_D
    Logic_C --> Logic_E

Expected result: Render directional subgraphs correctly. https://mermaid-js.github.io/mermaid-live-editor/edit/?gist=https://gist.github.com/grashaar/5c939c86cc1fc497937e6a22bc75418b

dayfuaim commented 2 years ago

Yes, I second this. And for mermaid's classDiagram & gitGraph too.

I think it's about upgrading mermaid to the up-to-date version. ;)

kierandg commented 1 year ago

I also encountered this problem. Mermaid can't render with direction. It also does not render correctly with "htmlLabels": true.