Wiki CgX

Parce que j'ai un cerveau, mais pas trop.

Outils pour utilisateurs

Outils du site


wiki:syntaxe:diagram

Différences

Ci-dessous, les différences entre deux révisions de la page.

Lien vers cette vue comparative

Les deux révisions précédentesRévision précédente
Prochaine révision
Révision précédente
wiki:diagram-syntax [05 Aug 2021 :: 09:00] CgXwiki:syntaxe:diagram [05 Aug 2021 :: 09:09] (Version actuelle) – ↷ Page déplacée et renommée de wiki:diagram-syntax à wiki:syntaxe:diagram CgX
Ligne 7: Ligne 7:
 {{ :wiki:screenshot_2021-08-05_at_08-51-43_dokuwiki_plugin_diagram_-_nikita_melnichenko_s_website.png?nolink |}} {{ :wiki:screenshot_2021-08-05_at_08-51-43_dokuwiki_plugin_diagram_-_nikita_melnichenko_s_website.png?nolink |}}
  
 +
 +  * Diagram specification is a multiline expression.
 +  * Each line consists of control characters, that define links between blocks, and letter sequences, that define blocks.
 +  * These entities are separated by the special character `|'.
 ===== Quelques exemples ===== ===== Quelques exemples =====
  
Ligne 26: Ligne 30:
  
 ==== Avec textes plus longs ==== ==== Avec textes plus longs ====
 +
 +<code>
 +| root |-| 1-st branch |
 +| |:| | | | | |
 +| |L|~|~| 2-nd branch |
 +</code>
  
 <diagram> <diagram>
Ligne 34: Ligne 44:
  
  
-==== Avec liens ====+==== Avec liens & Syntaxe Wiki ==== 
 + 
 +On peut représenter les cases par des variables qu'on peut nommer en fin de ligne avec | et = : 
 + 
 +<code> 
 +| AAA |-| BBB |AAA=root|BBB=1<sup>st</sup> branch (see [[wp>Branch]]) 
 +| |:| | | | | | 
 +| |L|~|~| CCC |CCC=2<sup>nd</sup> branch\\ **(very important branch)** 
 +</code> 
  
 <diagram> <diagram>
Ligne 44: Ligne 63:
  
 ==== Tous les types de connecteurs ==== ==== Tous les types de connecteurs ====
 +
 +<code>
 +| | |v| | | | |V| | |
 +| |,|!|.| | |F|:|7| | | |y| | |p| |
 +|)|-|+|-|(|D|~|%|~|C| |}| |{|]| |[| |*| |#|
 +| |`|!|'| | |L|:|J| | | |h| | |b| |
 +| | |^| | | | |A| | |
 +</code>
 +
  
 <diagram> <diagram>
Ligne 55: Ligne 83:
  
 ==== Généalogique ==== ==== Généalogique ====
 +
 +<code>
 +| | | Dad |y| Mom | | |Dad=Daddy|Mom=Mommy
 +| |,|-|-|-|+|-|-|-|.| |
 +| Sys | |  Me | | Bro |Sys=Syster|Bro=Brother
 +</code>
  
 <diagram> <diagram>
Ligne 64: Ligne 98:
  
 ==== Coloré ==== ==== Coloré ====
 +
 +On peut représenter du code CSS pour les cases, avec {} en fin de ligne :
 +
 +<code>
 +| AAA | | | | |F|~|~|~|7| |AAA{border-color:blue;background-color:lightgreen}=Border is blue,\\ background is lightgreen
 +| |!| | | | | CCC | | DDD |CCC{border-color:#a9c}=Border is #a9c,\\ background is transparent|DDD{border-color:silver;background-color:silver;}=Border is silver,\\ background is silver
 +| BBB | | | | | | | | | | |BBB{border-color:rgb(0%,50%,0%);background-color:#abcdef}=Border is green,\\ background is #abcdef
 +</code>
  
 <diagram> <diagram>
Ligne 73: Ligne 115:
  
 ==== Identations & Alignements ==== ==== Identations & Alignements ====
 +
 +
 +<code>
 +|Left|                 |Left{text-align:left;}=Text is\\ aligned to the left
 +| |!|
 +| |`|-|-|Center|       |Center=By default text is aligned\\ to the center
 +| | | | |  |!|
 +| | | | |  |`|-|-|Right|Right{text-align:right;padding:1em}=Align text\\ to the right\\ and setup indents
 +</code>
  
 <diagram> <diagram>
Ligne 84: Ligne 135:
  
 ==== Etendus (branches plus longues) ==== ==== Etendus (branches plus longues) ====
 +
 +<code>
 +| AAA |-|-|-| BBB | | | | | | |
 +| |:|
 +| |:| | | | | | | | | | | DDD |
 +| |:|
 +| |L|~|~|~|~| CCC |
 +</code>
  
 <diagram> <diagram>
Ligne 95: Ligne 154:
  
 ==== Avec flèches ==== ==== Avec flèches ====
 +
 +<code>
 +|  AAA  |-@2|  BBB  |-@a|  EEE   |
 +| |:@1| |   | |!@4| |   | |}@72|-|-| GGG |
 +|  DDD  |~@8|  CCC  |    FFF   |
 +</code>
  
 <diagram> <diagram>
wiki/syntaxe/diagram.1628146850.txt.gz · Dernière modification : 05 Aug 2021 :: 09:00 de CgX