JS Sequence Diagrams

it2024-05-08  52

Usage

Andrew->China: Says Hello Note right of China: China thinks\nabout it China-->Andrew: How are you? Andrew->>China: I am good thanks! Andrew->China: Says Hello Note right of China: China thinks\nabout it China-->Andrew: How are you? Andrew->>China: I am good thanks! ``` ## Configuration Configure for all home and regular pages: ```toml [params.sequenceDiagrams] enable = true options = "{theme: 'hand'}"

Configure for a single post in the front matter (Params in front matter have higher precedence):

sequenceDiagrams: enable: true options: "{theme: 'hand'}"

Options

options = { // Change the styling of the diagram, typically one of 'simple', 'hand'. New themes can be registered with registerTheme(...). theme: string, // CSS style to apply to the diagram's svg tag. (Only supported if using snap.svg) css_class: string, }

See more information from https://github.com/bramp/js-sequence-diagrams.

Examples

Title: Here is a title A->B: Normal line B-->C: Dashed line C->>D: Open arrow D-->>A: Dashed open arrow ```sequence Title: Here is a title A->B: Normal line B-->C: Dashed line C->>D: Open arrow D-->>A: Dashed open arrow ```
# Example of a comment. Note left of A: Note to the\n left of A Note right of A: Note to the\n right of A Note over A: Note over A Note over A,B: Note over both A and B ```sequence # Example of a comment. Note left of A: Note to the\n left of A Note right of A: Note to the\n right of A Note over A: Note over A Note over A,B: Note over both A and B ```
最新回复(0)