====== Plugin : DIAGRAM ======

Construction de diagrammes et arbres généalogiques.

Liens : 
  * https://www.dokuwiki.org/plugin:diagram
  * http://nikita.melnichenko.name/projects/dokuwiki-diagram/index.php?lang=en
  * Téléchargement : http://nikita.melnichenko.name/download.php?q=dokuwiki-diagram-latest.tgz

===== Syntaxe =====

<code>
<diagram>
Diagram specification
</diagram>
</code>

|  ,  |  .  |  `  |  '  |  %%^%%  |  v  |  (  |  )  |  -  |  !  |  +  |



{{ :plugins:plugin_diagram_types_de_connexions.jpg?nolink |}}


===== Exemples =====

<code>
<diagram>
| AAA |-| BBB |
| |:| | | | | |
| |L|~|~| CCC |
</diagram>
</code>

<diagram>
| AAA |-| BBB |
| |:| | | | | |
| |L|~|~| CCC |
</diagram>

<code>
<diagram>
| root |-| 1-st branch |
| |:| | | | | |
| |L|~|~| 2-nd branch |
</diagram>
</code>

<diagram>
| root |-| 1-st branch |
| |:| | | | | |
| |L|~|~| 2-nd branch |
</diagram>

==== Abbréviations ====

<code>
<diagram>
| AAA |-| BBB |AAA=root|BBB=1<sup>st</sup> branch (see [[wp>Branch]])
| |:| | | | | |
| |L|~|~| CCC |CCC=2<sup>nd</sup> branch\\ **(very important branch)**
</diagram>
</code>

<diagram>
| AAA |-| BBB |AAA=root|BBB=1<sup>st</sup> branch (see [[wp>Branch]])
| |:| | | | | |
| |L|~|~| CCC |CCC=2<sup>nd</sup> branch\\ **(very important branch)**
</diagram>

<code>
<diagram>
| | | Dad |y| Mom | | |Dad=Daddy|Mom=Mommy
| |,|-|-|-|+|-|-|-|.| |
| Sys | |  Me | | Bro |Sys=Syster|Bro=Brother
</diagram>
</code>

<diagram>
| | | Dad |y| Mom | | |Dad=Daddy|Mom=Mommy
| |,|-|-|-|+|-|-|-|.| |
| Sys | |  Me | | Bro |Sys=Syster|Bro=Brother
</diagram>

==== Styles ====

<code>
<diagram>
| 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
</diagram>
</code>

<diagram>
| 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
</diagram>

==== Alignement du texte et indentation ====

<code>
<diagram>
|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
</diagram>
</code>

<diagram>
|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
</diagram>

<code>
<diagram>
| AAA |-| BBB |
| |:| | | | | | | DDD |
| |L|~|~| CCC |
</diagram>
</code>

<diagram>
| AAA |-| BBB |
| |:| | | | | | | DDD |
| |L|~|~| CCC |
</diagram>

<code>
<diagram>
| AAA |-|-|-| BBB | | | | | | |
| |:|
| |:| | | | | | | | | | | DDD |
| |:|
| |L|~|~|~|~| CCC |
</diagram>
</code>

<diagram>
| AAA |-|-|-| BBB | | | | | | |
| |:|
| |:| | | | | | | | | | | DDD |
| |:|
| |L|~|~|~|~| CCC |
</diagram>

==== Flèches ====

<code>
<diagram>
|  AAA  |-@2|  BBB  |-@a|  EEE   |
| |:@1| |   | |!@4| |   | |}@72|-|-| GGG |
|  DDD  |~@8|  CCC  |   |  FFF   |
</diagram>
</code>

<diagram>
|  AAA  |-@2|  BBB  |-@a|  EEE   |
| |:@1| |   | |!@4| |   | |}@72|-|-| GGG |
|  DDD  |~@8|  CCC  |   |  FFF   |
</diagram>

==== Autres ====

<code>
<diagram>
| | |v| | | | |V| | |
| |,|!|.| | |F|:|7| | | |y| | |p| |
|)|-|+|-|(|D|~|%|~|C| |}| |{|]| |[| |*| |#|
| |`|!|'| | |L|:|J| | | |h| | |b| |
| | |^| | | | |A| | |
</diagram>
</code>

<diagram>
| | |v| | | | |V| | |
| |,|!|.| | |F|:|7| | | |y| | |p| |
|)|-|+|-|(|D|~|%|~|C| |}| |{|]| |[| |*| |#|
| |`|!|'| | |L|:|J| | | |h| | |b| |
| | |^| | | | |A| | |
</diagram>

===== Exemples d'arbres généalogiques =====

  * [[diagram_2|Kennedy family tree]]
  * [[diagram_3|Kennedy family tree with arrows]]

==== #1 ====


<code>
<diagram>
| | | Dad |y| Mom | | |Dad=Daddy|Mom=Mommy
| |,|-|-|-|^|-|-|-|.| |
| Sys | | | | | Bro |Sys=Syster|Bro=Brother
</diagram>
</code>

<diagram>
| | | Dad |y| Mom | | |Dad=Daddy|Mom=Mommy
| |,|-|-|-|^|-|-|-|.| |
| Sys | | | | | Bro |Sys=Syster|Bro=Brother
</diagram>

==== #2 ====

<code>
<diagram>
| Pa2 |y| Ma2 | | | | | | | | Pa1 |y| Ma1 | | | | | | |
| |,|-|^|-|.| | | |,|-|-|-|v|-|-|-|+|-|-|-|v|-|-|-|.| |
| Bo5 | | Dad |y| Mom | | Bo1 | | Bo2 | | Bo3 | | Bo4 |Dad=[[Daddy]]|Mom=[[Mommy]]
| | | |,|-|-|-|^|-|-|-|.| |:| | | |:| | | |:| | | |:| |
| | | Sys | | | | | Bro |Sys=[[Syster]]|Bro=[[Brother]]
</diagram>
</code>

<diagram>
| Pa2 |y| Ma2 | | | | | | | | Pa1 |y| Ma1 | | | | | | |
| |,|-|^|-|.| | | |,|-|-|-|v|-|-|-|+|-|-|-|v|-|-|-|.| |
| Bo5 | | Dad |y| Mom | | Bo1 | | Bo2 | | Bo3 | | Bo4 |Dad=[[Daddy]]|Mom=[[Mommy]]
| | | |,|-|-|-|^|-|-|-|.| |:| | | |:| | | |:| | | |:| |
| | | Sys | | | | | Bro |Sys=[[Syster]]|Bro=[[Brother]]
</diagram>