diff options
author | Julio Capote <jcapote@gmail.com> | 2018-11-06 02:49:16 +0000 |
---|---|---|
committer | Julio Capote <jcapote@gmail.com> | 2018-11-06 02:49:16 +0000 |
commit | a62a3e7755579d93ce3a87243dd277575930fffe (patch) | |
tree | 6d074f7294c5b7a45bed7ac229a6802830da2a04 /themes/even/exampleSite/content/post/js-sequence-diagrams.md | |
download | capotej.com-a62a3e7755579d93ce3a87243dd277575930fffe.tar.gz |
init
Diffstat (limited to '')
-rw-r--r-- | themes/even/exampleSite/content/post/js-sequence-diagrams.md | 95 |
1 files changed, 95 insertions, 0 deletions
diff --git a/themes/even/exampleSite/content/post/js-sequence-diagrams.md b/themes/even/exampleSite/content/post/js-sequence-diagrams.md new file mode 100644 index 0000000..3ca3a1c --- /dev/null +++ b/themes/even/exampleSite/content/post/js-sequence-diagrams.md @@ -0,0 +1,95 @@ +--- +title: "JS Sequence Diagrams" +date: 2015-03-04T21:57:45+08:00 +draft: false + +sequenceDiagrams: + enable: true + options: "{theme: 'hand'}" +--- + +## Usage + +```sequence +Andrew->China: Says Hello +Note right of China: China thinks\nabout it +China-->Andrew: How are you? +Andrew->>China: I am good thanks! +``` + +<!--more--> + + ```sequence + 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**): + +```yml +sequenceDiagrams: + enable: true + options: "{theme: 'hand'}" +``` + +### Options + +```js +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 + +```sequence +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 + ``` + +--- + +```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 +``` + + ```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 + ``` |