Mermaid:Theme test: Difference between revisions

From RECESSIM, A Reverse Engineering Community
The following pages link to this diagram: Help:Diagrams
Jump to navigation Jump to search
Theme test diagram: every node shape, link style and nested subgraph, for validating the sitewide theme
 
Lay the shape gallery out in rows using invisible links
Line 3: Line 3:
   subgraph SHAPES [Node shapes]
   subgraph SHAPES [Node shapes]
     direction LR
     direction LR
     n1[rectangle]
     n1[rectangle] ~~~ n2(rounded) ~~~ n3([stadium]) ~~~ n4[[subroutine]] ~~~ n5[(cylinder)]
    n2(rounded)
     n6((circle)) ~~~ n7>asymmetric] ~~~ n8{rhombus} ~~~ n9{{hexagon}} ~~~ n10[/parallelogram/]
    n3([stadium])
     n11[\parallelogram alt\] ~~~ n12[/trapezoid\] ~~~ n13[\trapezoid alt/] ~~~ n14(((double circle)))
    n4[[subroutine]]
    n5[(cylinder)]
     n6((circle))
    n7>asymmetric]
    n8{rhombus}
    n9{{hexagon}}
    n10[/parallelogram/]
     n11[\parallelogram alt\]
    n12[/trapezoid\]
    n13[\trapezoid alt/]
    n14(((double circle)))
   end
   end



Revision as of 22:15, 22 September 2026

flowchart TD subgraph SHAPES [Node shapes] direction LR n1[rectangle] ~~~ n2(rounded) ~~~ n3([stadium]) ~~~ n4[[subroutine]] ~~~ n5[(cylinder)] n6((circle)) ~~~ n7>asymmetric] ~~~ n8{rhombus} ~~~ n9{{hexagon}} ~~~ n10[/parallelogram/] n11[\parallelogram alt\] ~~~ n12[/trapezoid\] ~~~ n13[\trapezoid alt/] ~~~ n14(((double circle))) end subgraph LINKS [Link styles, arrowheads and edge labels] direction LR a1[from] --> a2[arrow] b1[from] --- b2[open] c1[from] -.-> c2[dotted] d1[from] ==> d2[thick] e1[from] --x e2[cross end] f1[from] --o f2[circle end] g1[from] -->|edge label| g2[labelled] end subgraph NESTED [Nested subgraph and cluster edges] direction LR subgraph INNER [Inner cluster] h1[inside] end h1 --> h2[outside the inner cluster] end SHAPES --> LINKS LINKS --> NESTED
flowchart TD

  subgraph SHAPES [Node shapes]
    direction LR
    n1[rectangle] ~~~ n2(rounded) ~~~ n3([stadium]) ~~~ n4[[subroutine]] ~~~ n5[(cylinder)]
    n6((circle)) ~~~ n7>asymmetric] ~~~ n8{rhombus} ~~~ n9{{hexagon}} ~~~ n10[/parallelogram/]
    n11[\parallelogram alt\] ~~~ n12[/trapezoid\] ~~~ n13[\trapezoid alt/] ~~~ n14(((double circle)))
  end

  subgraph LINKS [Link styles, arrowheads and edge labels]
    direction LR
    a1[from] --> a2[arrow]
    b1[from] --- b2[open]
    c1[from] -.-> c2[dotted]
    d1[from] ==> d2[thick]
    e1[from] --x e2[cross end]
    f1[from] --o f2[circle end]
    g1[from] -->|edge label| g2[labelled]
  end

  subgraph NESTED [Nested subgraph and cluster edges]
    direction LR
    subgraph INNER [Inner cluster]
      h1[inside]
    end
    h1 --> h2[outside the inner cluster]
  end

  SHAPES --> LINKS
  LINKS --> NESTED