mermaid-server/single_line_examples.md

1.4 KiB

Single Line Mermaid Examples

Basic Flowchart (Single Line)

graph TD; A[Analytics]-->B[Traffic]; A-->C[Revenue]; B-->D[Desktop]; B-->E[Mobile]

Simple Analytics Dashboard

graph LR; A[Website]-->B[Users: 1.2M]; A-->C[Revenue: $450K]; A-->D[Growth: +25%]

Process Flow

graph TD; Start[Start]-->Process[Process Data]-->Decision{Valid?}-->|Yes|End[Complete]; Decision-->|No|Error[Error]

Network Diagram

graph LR; Client[Client]-->LB[Load Balancer]-->Server1[Server 1]; LB-->Server2[Server 2]; Server1-->DB[(Database)]; Server2-->DB

Sequence Diagram (Single Line)

sequenceDiagram; participant A as User; participant B as System; A->>B: Request; B-->>A: Response

Pie Chart (Single Line)

pie title Traffic Sources; "Direct": 40; "Search": 35; "Social": 15; "Referral": 10

Git Flow

gitGraph; commit; commit; branch develop; commit; commit; checkout main; merge develop

Simple Class Diagram

classDiagram; class User { +name: string +email: string +login() }; class Admin { +permissions: array +manage() }; User <|-- Admin

State Diagram

stateDiagram-v2; [*]-->Idle; Idle-->Processing: start; Processing-->Complete: finish; Complete-->[*]

Journey Map

journey; title User Shopping Journey; section Discovery; Search: 5: User; Compare: 3: User; section Purchase; Add to Cart: 4: User; Checkout: 2: User