README.md in jekyll-diagrams-0.9.0 vs README.md in jekyll-diagrams-0.9.1

- old
+ new

@@ -205,10 +205,24 @@ ```bash $ npm install -g mermaid.cli ``` +**Notice:** You may need to install some missing libraries, follow the output of `mmdc`. + +#### Examples + +```text +{% mermaid %} +sequenceDiagram + participant John + participant Alice + Alice->>John: Hello John, how are you? + John-->>Alice: Great! +{% endmermaid %} +``` + #### Configurations | Config | Default | Description | | ----------------- | ------- | ------------------------------------------------------------- | | `theme` | default | Theme of the chart, could be default, forest, dark or neutral | @@ -317,18 +331,30 @@ ### Svgbob #### Prerequisites -- Install `cargo` -- Install `svgbob_cli` +Install `svgbob_cli`. ```bash $ sudo apt install cargo $ cargo install svgbob_cli ``` +#### Examples + +```text +{% svgbob %} + .---> F + A B C D / + *-------*-----*---*----*-----> E + \ ^ \ + v / '---> G + B --> C -' +{% endsvgbob %} +``` + #### Configuration | Config | Default | Description | | -------------- | ------- | ---------------------------------------------------------- | | `font-family` | arial | Font | @@ -338,15 +364,15 @@ ### Syntrax #### Prerequisites -- Install Pango, Cairo and PangoCairo +- Install Pango, Cairo and PangoCairo support - Install `syntrax` ```bash -$ sudo apt install libpango1.0-dev python3-cairo python3-gi +$ sudo apt install libpango1.0-dev python3-cairo python3-gi python3-gi-cairo $ pip3 install syntrax ``` #### Examples @@ -378,9 +404,33 @@ ```bash $ npm install -g vega-cli vega-lite ``` The you can use `vega` and `vegalite` tag. + + +#### Examples + +```text +{% vegalite %} +{ + "": "https://vega.github.io/schema/vega-lite/v4.json", + "description": "A simple bar chart with embedded data.", + "data": { + "values": [ + {"a": "A", "b": 28}, {"a": "B", "b": 55}, {"a": "C", "b": 43}, + {"a": "D", "b": 91}, {"a": "E", "b": 81}, {"a": "F", "b": 53}, + {"a": "G", "b": 19}, {"a": "H", "b": 87}, {"a": "I", "b": 52} + ] + }, + "mark": "bar", + "encoding": { + "x": {"field": "a", "type": "ordinal"}, + "y": {"field": "b", "type": "quantitative"} + } +} +{% endvegalite %} +``` #### Configurations | Config | Default | Description | | ------- | ------- | ------------------- | \ No newline at end of file