Skip to content
Snippets Groups Projects

Create a post announcing and explaining Kroki usage

Merged Create a post announcing and explaining Kroki usage
kroki-post into master
Merged Huste, Tobias requested to merge kroki-post into master
Compare
and
Show latest version
1 file
+ 127
− 5
Compare changes
  • Side-by-side
  • Inline
_posts/2021/05/2021-05-26-diagrams-from-textual-descriptions.md → _posts/2021/06/2021-06-02-easy-diagram-creation-in-gitlab.md
+ 127
− 5
---
title: "Easy Diagram creation in Gitlab"
title_image: clark-tibbs-oqStl2L5oxI-unsplash.jpg
data: 2021-05-26
data: 2021-06-02
authors:
- huste
- jandt
layout: blogpost
categories:
- tutorials
@@ -208,7 +209,108 @@ For a complete list please refer to the official
### Vega
#### Word Cloud
The following wordcloud is generated from the
[mission statement of the Helmholtz Association](https://www.helmholtz.de/en/about-us/the-association/mission/)
using [Vega](https://vega.github.io/vega/).
<details>
<summary>Show code</summary>
<div markdown=1>
```vega
{
"$schema": "https://vega.github.io/schema/vega/v5.json",
"description": "A word cloud visualization depicting the mission statement of Helmholtz.",
"width": 800,
"height": 400,
"padding": 0,
"data": [
{
"name": "table",
"values": [
"We contribute to solving the major challenges facing society, science and the economy by conducting top-level research in strategic programmes within our six research fields: Energy, Earth & Environment, Health, Aeronautics, Space and Transport, Matter, and Information. We research highly complex systems using our large-scale devices and infrastructure, cooperating closely with national and international partners. We contribute to shaping our future by combining research and technology development with perspectives for innovative application and provisions in tomorrow's world. We attract and promote the best young talents, offering a unique research environment and general support throughout all career stages.",
"The Helmholtz Association performs cutting-edge research which contributes substantially to solving the grand challenges of science, society and industry. Helmholtz Association scientists focus on researching the highly-complex systems which determine human life and the environment, for example: ensuring that society remains mobile, ensuring that society has a reliable energy supply, ensuring that future generations live in a secure ecosystem, and developing treatments for previously incurable diseases.",
"The Helmholtz Association performs cutting-edge research which contributes substantially to solving the grand challenges of science, society and industry. Helmholtz Association scientists focus on researching the highly-complex systems which determine human life and the environment, for example: ensuring that society remains mobile, ensuring that society has a reliable energy supply, ensuring that future generations live in a secure ecosystem, and developing treatments for previously incurable diseases.",
"The activities of the Helmholtz Association focus on securing the long-term foundations of human life and on creating the technological basis for a competitive economy. Our potential, as an Association, to achieve these goals is due to the outstanding scientists working at our 18 major research centres, a high-performance infrastructure and modern research management.",
"Our scientists develop national research programmes for each of these fields and international experts review these programmes. These expert evaluations form the basis of the programme-oriented funding (POF) which finances to Helmholtz Association research.",
"Within the six research fields, Helmholtz scientists cooperate with each other and with external partners - working across disciplines, organisations and national borders. Indeed, the being part of the Helmholtz Association means making concerted research effort in which networks form the key to inquiring thought and action. Concerted research is efficient and flexible. The Helmholtz Association uses this research to create an effective basis for shaping the future."
],
"transform": [
{
"type": "countpattern",
"field": "data",
"case": "upper",
"pattern": "[\\w']{3,}",
"stopwords": "(i|me|my|myself|we|us|our|ours|ourselves|you|your|yours|yourself|yourselves|he|him|his|himself|she|her|hers|herself|it|its|itself|they|them|their|theirs|themselves|what|which|who|whom|whose|this|that|these|those|am|is|are|was|were|be|been|being|have|has|had|having|do|does|did|doing|will|would|should|can|could|ought|i'm|you're|he's|she's|it's|we're|they're|i've|you've|we've|they've|i'd|you'd|he'd|she'd|we'd|they'd|i'll|you'll|he'll|she'll|we'll|they'll|isn't|aren't|wasn't|weren't|hasn't|haven't|hadn't|doesn't|don't|didn't|won't|wouldn't|shan't|shouldn't|can't|cannot|couldn't|mustn't|let's|that's|who's|what's|here's|there's|when's|where's|why's|how's|a|an|the|and|but|if|or|because|as|until|while|of|at|by|for|with|about|against|between|into|through|during|before|after|above|below|to|from|up|upon|down|in|out|on|off|over|under|again|further|then|once|here|there|when|where|why|how|all|any|both|each|few|more|most|other|some|such|no|nor|not|only|own|same|so|than|too|very|say|says|said|shall)"
},
{
"type": "formula", "as": "angle",
"expr": "[-45, 0, 45][~~(random() * 3)]"
},
{
"type": "formula", "as": "weight",
"expr": "if(datum.text=='VEGA', 600, 300)"
}
]
}
],
"scales": [
{
"name": "color",
"type": "ordinal",
"domain": {"data": "table", "field": "text"},
"range": ["#005aa0", "#8cb423", "#5a696e"]
}
],
"marks": [
{
"type": "text",
"from": {"data": "table"},
"encode": {
"enter": {
"text": {"field": "text"},
"align": {"value": "center"},
"baseline": {"value": "alphabetic"},
"fill": {"scale": "color", "field": "text"}
},
"update": {
"fillOpacity": {"value": 1}
},
"hover": {
"fillOpacity": {"value": 0.5}
}
},
"transform": [
{
"type": "wordcloud",
"size": [800, 400],
"text": {"field": "text"},
"rotate": {"field": "datum.angle"},
"font": "Helvetica Neue, Arial",
"fontSize": {"field": "datum.count"},
"fontWeight": {"field": "datum.weight"},
"fontSizeRange": [12, 56],
"padding": 2
}
]
}
]
}
```
</div>
</details>
<details open="true">
<summary>Show rendered plot</summary>
<div markdown=1>
![Sample Vega diagram](https://kroki.hzdr.de/vega/svg/eNrtWFuPG7cVfvevIJSisgutvL6s4RrIg1G4TR5SF41RPzj7QM1QGiac4YTkSJbNzW_v9x2ORtLu2ujlNYBEDsnDc7_NfH6g1OwPsWpMq2ev1KxJqY-vHj_emo1ebmxqhtXS-scFQHYfb6-WP0ffzRa8WptYBdsniw1cf612PtSqcn6o1dbGQTv7SfNU1aa3VbLdRqXGqNbGyN2YdDKt6ZLya_WdcW3jXfq0LMh3tk4N0L68vJR1Y-ymSdh4Pm70uq6BETtYCzs6UYwPeFbqs4zY7XRryF3SK2cEtWxvtRtMnMBl771Rle9SsKshGZW8it5tJ6b1zz6oqtHOmW5jolrrimfRV9ak_UJFzF1llO5quWCAy7d7tdoTaz2M8vv-wpmtcSqYaHSoGmWpiQBVbGyl-uA3QbctCOxgAZz5IahoPx7h19a4Or5SbzoTNiD8RofUqD9ivbXBd1ToAurULjUL9dpgSw_JVnGhfuz1yOC7oLvY-wDIH3RKJixk-_tu7UMrNlsqqGOi2UD5joK0vTMfVdxHWC6qIVImcuh02JiLWGlnYO2trSAAMdpuHTTEg_hDMAtg8L2BsLwHT4kGWCmo6oSqduMtsDTt9BAQskZh6ZaFGt0fWFgPJFH03a5sx_1JALGKqZrOO7_Zk0XjfC_OJ-TBVOwNbLSlaWFp23V-q7lWuu-drYonEw9sBPfGKtJ2ybc-BL-bR_q_q4VL6DToKh3AW0924RQrE5Pa-4GeAFV1CVbx67UJZFarobO_DidqN0eTCqqNgR6gkTj0NB5QBj9sGj_g2DlV6WBMYFzBQZeTs8O134H2FGHqdaTXFoEgOG0eVTUkWuXC1JsTDnaNxXhUegTtFQh0yYLi_naUwHfB5kmUILLHwFgcQmW0cD3ALfbLL7All5KNidaoBiDqJqYOxIpTXtx2ysJybeBCre0ANrS6U86uT2LzNFRobfNRE8krnMQhFAI6TRwHJEALc7d-ZR0kuR-q0fB5wDrLXKOMxKfYyu1v3xmdtRg0iS85-hocSqtoKh4igxSZSnCOPisogtGJ3Bdf7QMizg8R9rAdrgr52kJb8Xc_-N0PvuAHmtnOJlusk77oGZPehZ2D0p2Hj1C1OB-6euQdiG6pGfcqcnm4NyVhZFSnVjrawruW4mKSlZQ7Fs-leovE3iN7ip9BflaVU-4W9DwNX4BSiD9Cl147ZOao6kFqBKkiQ9JZa6nYR5dCwv5FMm-SCvLk5VjmJ7evAIkFCIuXXYxRolnoz0ubCNv6GnXreB2ASMU00Jn2KdQJF6NBjyVwun_SDYh3QtDRVpCz9AH31EvzEWwCL73B7EboI6qleic7BUwZtkKj-ShbqVNil9EtpqsXPpBpU8Ntiy4f_uPtXx-Nkba2HfUSqfP7Pekg15ky3pc2h4TuaXMWJ6hOVHZoI0yp3kUxQBFEHWXvo-jk2D6oi6O9q-BjZGhUFrW9o4V92OjOxlETRDMpdIW-VvqP77vamHoxlnJiIvKvh09rNDOGFsJw6wpKhwaPNX69ZimHCooaO5PI5okxfjGSX23362DH-GPVLy0Bo5jd2l_uYoYFgdyK1gR2jfRokRPEA77A7hBpwcbGIx7QlhCmjxNjaZNOYvfQhZHZktCWs9HA11PHndhyUqazpvvz9ESQfS-9eoWMknrpS7sTVwGEOAVBpNk_O6qQ5HiCNGvC-dEBFU4__PTTbn79-dni5hwkojHn6wtfCWYPbW5Nbvf4oUFd553JQ8zIEPzLA7bRKGZ0cvwHGWIZeWF_BGlMbmyLf-Qsp5F7JvAfZeCmTfhF_rmCJvccWg42lDHKzoh3h-qRxWMwev5bDtFkGi-zuGSJfIzc1W3GNhrEvNO4bfCw4s90WTw5N3oLtnDW6JoL7tUePxCrbY0H7uysc3nnB1dDDJkq3eVKnsQps523lH8eKOQ8Uto55ZqTKncpG2c7B0FCYsLJdjzZ8qSWg5oYasFQE6QuEDUAwAUhMOEQYyzTTkaBwmxjN0-UmRPElsmUZVOWlLrMNSdKW2YZrWzufBkhIx_g7WU6bFR6HDufiiq4btHXcHaGotMe1EDj58V2czG9kaMy7xpwItO43BOGLxZZZygZcJjqjPYr23X2AYar9EDbxoyAsY7-4Ez26wzjr_YZ0ZaZC7NeoQBmvWHzghNkGNodVcPn8RUi11LacYZLwLhGwPDalj7i_C4DdI0XmTz0-PkOGtoRQyZiLPESkwEcwEjNmySV10OgcOQcEMhPInIRWMQtwlJUCprRLULCfV4hlWfm9Lw2u9ySodaDccnwOXoEZxxw2nn8Qqbafef2mSxFzVPKRZV5n8HUHrvyhzdqS4cCpUezKf5vFl_PR8xag0O-UTMtCUJ3m5OPCQKLahokwVw8v1qoy4V6fnX94bffHrIR9u3DR-pP6tmj6_-D5q58ALmXqF0_REIc2mVC1fv22_m_3vzt9XyhXlyCj2eXl6eiHvLyg8Pqunw9kVf3-OXvJxV6tmNandhEykTZd8cDCAvT4-jz4YPM4dPLSfYmm7NJAzPoaENsH2bfXF5eaX1J4G9eVqvnT5_J45V-8ecXZnaH6VajUN7l-cCckJmo0H3v4evIBt5O0L8R5NidsN0JZ1tqxEtMXxBIgLSzm6IH-dYkOizYzuFQRg1bkHNQ7fpGI1BtdQt8jQQsoGKwE8vcUe99robqCOnNbYGI9G2vK5v2Z2w8uR9Jw0j_T3FcLq9u7rjfzf_SFrA-y9fFW6XbfhLn4ZdCfh28XvzXtgo-jVo56zAQUCXSb5kAb8GE-I6VGBbS6u9mwNvg62BPImEC_bHwdwe1dDn3oH5_-NJ558aYAm7uJfHPQxA9ebpQVy-ub3VAh4-lT7-WCh7c_Btgeolr)
</div>
</details>
#### Bar Chart
<details>
<summary>Show code</summary>
<div markdown="1">
@@ -379,7 +481,12 @@ For a complete list please refer to the official
</div>
</details>
![Sample Vega diagram](https://kroki.hzdr.de/vega/svg/eNqtVzuP2zgQ7vdXCMQVl0DQyl5vEmx3xRVXXYArUgRGQEm0zFuJFEjKsdfQf8-QepEi5d0EaQxp-M17vhF9vYsi9IfMj6TG6ClCR6Ua-XR_fyIlTkqqjm2WUH7fA4z0_vSY_C85Q7FWLYjMBW0UBQGo_xUxIhUpogyLKD9ioSJyxnVTkTj6Dta0XEal4G2jQZcox4qUXFyS3tx3WqgjGHpIU_Pe4KKgrATJo3nHreKSvhDtC85ASUslLRmuJAi_wmsUXc0vHDBcG6jArCT_KdKgOEInXLVaujUuDC6jrADJFVHWtGrS0OiaMuMdnvBZP6XwKLWpp2jTGQNdHPZKGSPi85CB5ThNNm_3nE6e0-Tj7DpN0le881ateN_-mvfdz3g_EloeFZo8tU0BndYnSpCqovLvsyJMfd3sUW8Hfvd9NwGI11upWhgmORs2ac2tNzoID6FnWgPrdHJ4-pA8dPGrqF2yXUdls61P66h8RD0mGw-18Wztkp2H2nqoh-RxHZXPcW27AbSfaqSgq_LARe2WaXrSkEtjyovLUgDJoVWxfWwYm120fl-pDO0dwIGSqjBtgDDcI970cnwiAsNwuad4UpqkUwI3J2yYo3kSJG9FHpyR352_FWp825x22lamYiZRJBvMXNPk3AhnR0XvYUuyApA5-RPI0NZJzlum4sheKHFkE_wdenNIUuH8GfnNm6J7syViKLxi6rJxD_od7S0AtNb1eR_IHFfkxnI_G8Dc7YLX2Cyv67hKpoGw4svRlB5i1MyNEi2ZZC9E8KUMhsDsS1doNubT-O26ObM5r7iw5nIoJBfQQyiOb3P8PN7ObmSClR5G3bKO-GxXUXulugF6x3CleK31-1JaRbUc6qxtezUWz4G2jEkZyvQf6H4yBNf8myfJj38-OsDsKwdtVdEckuLbguauzcDZTGIojzd33RwqYTkviBsslIqIZURn04fpy9o57sa7zNWa_V7WhSg2fyIdFxdjYaZVilwvl-0CsLHN-7kt2OSReyzyxWWV01q9ntyT4Z72j15Qi5SdW1AX0vq3VZ6Wc3txtUIsXKPGclQshmRLswPnruMlxw5nvkB2fnX3c3Udjnk8q8hBOSwLFpnmhlYHuNESm3-joMIZqT5PF-NdKA6Xm6sbXJB8ub8Hlq5V0K1ZgCirZHmVMD2gH-fAHgptbuuzU1Wu4rBq3ZXo6Ukl-DP5MjF1-m_QOciFYpiqFl29Bq_PndEabssrqoZu-t_GSvhO5KytKh_4Ahd9siz-zRSP_BRuYcAnJCdIJmBw0Ztcbxau70LPgfvAXfcD8eeNnA==)
<details open="true">
<summary>Show rendered plot</summary>
<div markdown=1>
![Sample Vega diagram](https://kroki.hzdr.de/vega/svg/eNqtVzuP2zgQ7vdXCMQVl0DQyl5vEmx3xRVXXYArUgRGQEm0zFuJFEjKsdfQf8-QepEi5d0EaQxp-M17vhF9vYsi9IfMj6TG6ClCR6Ua-XR_fyIlTkqqjm2WUH7fA4z0_vSY_C85Q7FWLYjMBW0UBQGo_xUxIhUpogyLKD9ioSJyxnVTkTj6Dta0XEal4G2jQZcox4qUXFyS3tx3WqgjGHpIU_Pe4KKgrATJo3nHreKSvhDtC85ASUslLRmuJAi_wmsUXc0vHDBcG6jArCT_KdKgOEInXLVaujUuDC6jrADJFVHWtGrS0OiaMuMdnvBZP6XwKLWpp2jTGQNdHPZKGSPi85CB5ThNNm_3nE6e0-Tj7DpN0le881ateN_-mvfdz3g_EloeFZo8tU0BndYnSpCqovLvsyJMfd3sUW8Hfvd9NwGI11upWhgmORs2ac2tNzoID6FnWgPrdHJ4-pA8dPGrqF2yXUdls61P66h8RD0mGw-18Wztkp2H2nqoh-RxHZXPcW27AbSfaqSgq_LARe2WaXrSkEtjyovLUgDJoVWxfWwYm120fl-pDO0dwIGSqjBtgDDcI970cnwiAsNwuad4UpqkUwI3J2yYo3kSJG9FHpyR352_FWp825x22lamYiZRJBvMXNPk3AhnR0XvYUuyApA5-RPI0NZJzlum4sheKHFkE_wdenNIUuH8GfnNm6J7syViKLxi6rJxD_od7S0AtNb1eR_IHFfkxnI_G8Dc7YLX2Cyv67hKpoGw4svRlB5i1MyNEi2ZZC9E8KUMhsDsS1doNubT-O26ObM5r7iw5nIoJBfQQyiOb3P8PN7ObmSClR5G3bKO-GxXUXulugF6x3CleK31-1JaRbUc6qxtezUWz4G2jEkZyvQf6H4yBNf8myfJj38-OsDsKwdtVdEckuLbguauzcDZTGIojzd33RwqYTkviBsslIqIZURn04fpy9o57sa7zNWa_V7WhSg2fyIdFxdjYaZVilwvl-0CsLHN-7kt2OSReyzyxWWV01q9ntyT4Z72j15Qi5SdW1AX0vq3VZ6Wc3txtUIsXKPGclQshmRLswPnruMlxw5nvkB2fnX3c3Udjnk8q8hBOSwLFpnmhlYHuNESm3-joMIZqT5PF-NdKA6Xm6sbXJB8ub8Hlq5V0K1ZgCirZHmVMD2gH-fAHgptbuuzU1Wu4rBq3ZXo6Ukl-DP5MjF1-m_QOciFYpiqFl29Bq_PndEabssrqoZu-t_GSvhO5KytKh_4Ahd9siz-zRSP_BRuYcAnJCdIJmBw0Ztcbxau70LPgfvAXfcD8eeNnA==)
</div>
</details>
Taken from <https://vega.github.io/vega/examples/nested-bar-chart/>.
@@ -444,7 +551,12 @@ Taken from <https://vega.github.io/vega/examples/nested-bar-chart/>.
</div>
</details>
![Sample C4 PlantUML diagram](https://kroki.hzdr.de/plantuml/svg/eNqNVU1z2zgMvetXYH2pMqPabbJtZvZUJ06Tdp2PRvJmetJQEmyzpUgtScXx7Ox_L0jJshS3k_pgUeAj8AA8UB-MZdrWpYCRxXxtNc_QfDOj4A8uc1EXCGtrK_PXZKLZZrzidl1ntUGdK2lR2nGuykklmHQuXhtbCJ5Nzv98fedMi-v5pGTGoiZTek4nGJeoxxVhg1dQSzpckhOwa4SlEkJtuFyBIBAwWcBgm2tDKwUUHITKmRBb8tGxPAwQzKdfbxdJmtzepbPbh5vwKHjVmqZxGv99kZxfka01PXxKrtL5xeXFzYyMQXCH2iiZXjzZkEklt6WqTeoSj2A03RlgQYbRUQsO2WqlccUsFh2yszyHFiWX3FjNLKcwO_jAujsSxFuqYZmeqVoWTG_D_G3U79aY2nX0XwD0839dHcINZimrKkI_YAbTqhI8965HZPrMHlkEcaVdza__OY8gUSVtw-n4ye1PXT-Mq7c2rvCPHDdQoaoERtBEjqCVQQT4SA8yfFMZ_aPNx7DUqvS98-0CRziCgpOG6M3191MCBnOrfJID5rMs1CjSIiMe9yg8Zzo0Y5ZlzKCjd72Nv8zh3fhdwzYmN2gO-PknlFhmlMWaUyko-HfznG_GipWDX3J7VWegsVJtFgfUwiUXaHxHKOxHeoGmP47Fx2lyctyjY5DpfA1cFviE5mdpSmX-FXTgRrl0XILgz_oUlVyp2Rkcj48HSfrC3sfxZGppsUQsDISZUCsg2tYc-eLaDaI9DBnWVUF6dGpbNKudFuDUoYyihEgpow5ARdXKJx21Tod1akfV6wBItQxMvsaiFiR6ahZ3HP7vROwGym64bSgkzYoQve3mkqHdJspw06VJBEZn7umyC0gfByO6Fz7NkHG5XCXJXUx4j34-py_Afzarvz7iz3TbPRmzom2dK9hGc1daq3xfv8wnn2dnNIKV0hZOTt68b2N3fgaq2_t6DtvJqYfoCWnDNbpuWpUr0QY7Pn3z9rSlnS728niBeOGU-gL7vrsB_4cu-QPcYQKH5frddPZe94q7JP3uBE1zuVS6bC7b_cx0ZeuLoHO1V6eDDjxkqrZQ1RndsjQQ9FHy88FpaDm-4HUna-90N0y1cVczDbon1xv2viuX65xt0_vuxtyXmrY-oCzoa_gDr6egyQ==)
<details open="true">
<summary>Show rendered plot</summary>
<div markdown=1>
![Sample C4 PlantUML diagram](https://kroki.hzdr.de/plantuml/svg/eNqNVU1z2zgMvetXYH2pMqPabbJtZvZUJ06Tdp2PRvJmetJQEmyzpUgtScXx7Ox_L0jJshS3k_pgUeAj8AA8UB-MZdrWpYCRxXxtNc_QfDOj4A8uc1EXCGtrK_PXZKLZZrzidl1ntUGdK2lR2nGuykklmHQuXhtbCJ5Nzv98fedMi-v5pGTGoiZTek4nGJeoxxVhg1dQSzpckhOwa4SlEkJtuFyBIBAwWcBgm2tDKwUUHITKmRBb8tGxPAwQzKdfbxdJmtzepbPbh5vwKHjVmqZxGv99kZxfka01PXxKrtL5xeXFzYyMQXCH2iiZXjzZkEklt6WqTeoSj2A03RlgQYbRUQsO2WqlccUsFh2yszyHFiWX3FjNLKcwO_jAujsSxFuqYZmeqVoWTG_D_G3U79aY2nX0XwD0839dHcINZimrKkI_YAbTqhI8965HZPrMHlkEcaVdza__OY8gUSVtw-n4ye1PXT-Mq7c2rvCPHDdQoaoERtBEjqCVQQT4SA8yfFMZ_aPNx7DUqvS98-0CRziCgpOG6M3191MCBnOrfJID5rMs1CjSIiMe9yg8Zzo0Y5ZlzKCjd72Nv8zh3fhdwzYmN2gO-PknlFhmlMWaUyko-HfznG_GipWDX3J7VWegsVJtFgfUwiUXaHxHKOxHeoGmP47Fx2lyctyjY5DpfA1cFviE5mdpSmX-FXTgRrl0XILgz_oUlVyp2Rkcj48HSfrC3sfxZGppsUQsDISZUCsg2tYc-eLaDaI9DBnWVUF6dGpbNKudFuDUoYyihEgpow5ARdXKJx21Tod1akfV6wBItQxMvsaiFiR6ahZ3HP7vROwGym64bSgkzYoQve3mkqHdJspw06VJBEZn7umyC0gfByO6Fz7NkHG5XCXJXUx4j34-py_Afzarvz7iz3TbPRmzom2dK9hGc1daq3xfv8wnn2dnNIKV0hZOTt68b2N3fgaq2_t6DtvJqYfoCWnDNbpuWpUr0QY7Pn3z9rSlnS728niBeOGU-gL7vrsB_4cu-QPcYQKH5frddPZe94q7JP3uBE1zuVS6bC7b_cx0ZeuLoHO1V6eDDjxkqrZQ1RndsjQQ9FHy88FpaDm-4HUna-90N0y1cVczDbon1xv2viuX65xt0_vuxtyXmrY-oCzoa_gDr6egyQ==)
</div>
</details>
Taken from <https://github.com/plantuml-stdlib/C4-PlantUML>.
@@ -484,7 +596,12 @@ Taken from <https://github.com/plantuml-stdlib/C4-PlantUML>.
</div>
</details>
![Sample GraphViz diagram](https://kroki.hzdr.de/graphviz/svg/eNqtk01rwkAQhu_-isVTAxY2m69NJBX6QSnYU71ZkdVdNDRuwmY9SPS_d2NiEnWrFTyEvBOGZyYz79BoIUi6BO8g7wAwT_iccSmIZOFIrFlffROE_9BIhKPnIuIJZWCcLUnKQsHmiaCT4rNpQ4g9x4KuZzsOAuOYzFgcdmUkYxaAD56u5ZBsmPjm2zwqomCbrGXx3m3zfPww6IGBMVG6lrvuEdnDvoMdtybPErq5C9g0oePasAaz1YxRGvHFFAXg7RDo8SVSqb3oAdc2TvHQUwWQrcFb98B7PoaW23QfZ3JVND78Gn1egJasEmwifIY1kZqJax9jrZuwFjI0o3YRbJqVZJH9c4cmapa416djtmwMbVyjCycrF3P1TM0AvDThxSLY6IGq-VJUdffSO_8jVdbz_cbvqYgSEUnlzFfGM_b3qPawiqv1jAWb6VOWEiFX6jJv4Wq8WF3n49Op-3WX1sqqTKw7m1ZW5UWd-9sVS2vpTNyuWO5T58krWZXHLmcd7HKcVazyWla5mn5n9wvGN3i8)
<details open="true">
<summary>Show rendered plot</summary>
<div markdown=1>
![Sample GraphViz diagram](https://kroki.hzdr.de/graphviz/svg/eNqtk01rwkAQhu_-isVTAxY2m69NJBX6QSnYU71ZkdVdNDRuwmY9SPS_d2NiEnWrFTyEvBOGZyYz79BoIUi6BO8g7wAwT_iccSmIZOFIrFlffROE_9BIhKPnIuIJZWCcLUnKQsHmiaCT4rNpQ4g9x4KuZzsOAuOYzFgcdmUkYxaAD56u5ZBsmPjm2zwqomCbrGXx3m3zfPww6IGBMVG6lrvuEdnDvoMdtybPErq5C9g0oePasAaz1YxRGvHFFAXg7RDo8SVSqb3oAdc2TvHQUwWQrcFb98B7PoaW23QfZ3JVND78Gn1egJasEmwifIY1kZqJax9jrZuwFjI0o3YRbJqVZJH9c4cmapa416djtmwMbVyjCycrF3P1TM0AvDThxSLY6IGq-VJUdffSO_8jVdbz_cbvqYgSEUnlzFfGM_b3qPawiqv1jAWb6VOWEiFX6jJv4Wq8WF3n49Op-3WX1sqqTKw7m1ZW5UWd-9sVS2vpTNyuWO5T58krWZXHLmcd7HKcVazyWla5mn5n9wvGN3i8)
</div>
</details>
Taken from <https://graphviz.org/Gallery/directed/neural-network.html>.
@@ -502,7 +619,12 @@ Taken from <https://graphviz.org/Gallery/directed/neural-network.html>.
</div>
</details>
![Sample Blockdiag diagram](https://kroki.hzdr.de/blockdiag/svg/eNpLyslPzk7JTExXqOZSUFBwVNC1U3ACEc4gwsUaLugKItxAhLs1Vy0Ae3UMLA==)
<details open="true">
<summary>Show rendered plot</summary>
<div markdown=1>
![Sample Blockdiag diagram](https://kroki.hzdr.de/blockdiag/svg/eNpLyslPzk7JTExXqOZSUFBwVNC1U3ACEc4gwsUaLugKItxAhLs1Vy0Ae3UMLA==)
</div>
</details>
Taken from <http://blockdiag.com/en/blockdiag/examples.html>.

A HIFIS Service | Privacy | Imprint | Support | Documentation | Changelog