Diagram style samples

D2

Примеры с указанием команды генерации .svg:

• Standart, d2 arch.d2 arch.svg
• Theme: Sketch, d2 --sketch arch.d2 arch-sketch.svg
• Render: ELK, d2 --layout=elk arch.d2 arch-elk.svg
• Render: ELK, Theme: Sketch, d2 --layout=elk --sketch arch.d2 arch-elk-sketch.svg

Mermaid

Этот формат Github/Gitea конвертят в .svg на лету.

Примеры с указанием директивы, которой исходники отличаются между собой:

• Standart
• Theme: neutral, %%{init: {"theme": "neutral" }%%
• Theme: neutral, Arrow: linear, %%{init: {"theme": "neutral","flowchart": { "curve": "linear"}} }%%
• Arrow: linear, %%{init: {"flowchart": { "curve": "linear"}} }%%
• Render: ELK, %%{init: {"flowchart": {"defaultRenderer": "elk"}} }%%
• Render: ELK, Theme:neutral, %%{init: {"theme": "neutral","flowchart": {"defaultRenderer": "elk"}} }%%

Пример команды для генерации локальной копии:

IMG=ghcr.io/mermaid-js/mermaid-cli/mermaid-cli:10.2.5-beta.9
docker run --rm -u `id -u`:`id -g` -v $(PWD):/data $(IMG) -i mermaid.md -o readme.md

См также

• D2
• Mermaid
• Postgresql schema -> D2
• Данные для диаграммы взяты из архитектуры проекта Showonce v1.0