Wgraph:Sample Genealogy

From FollowTheScore
Jump to: navigation, search

This example demonstrates the power of wgraph in combination with

  1. mediawiki templates
  2. the Dynamic Page List extension (DPL).

We will guide you through a series of steps where a small genealogy tree is built.

We start with a straight forward approach and show how a very high level of abstraction can be reached.

Please go carefully through each step to understand the architecture of the final result.


First we define a small genealogy tree directly in WGL

  • We concentrate on the semantics
  • We do not use any coordinates or size attributes for the shapes
  • we use nodetypes (male, female, info) to share common properties
  • we use edgetypes (mother, father, married to, info) for the same purpose
  • we mark undefined nodes in a special way

Thus we reach a fair level of abstraction.

{{#wgraph: svg | wgl | thumb = 80 |

 node John_Smith       { type male   label "John Smith\n* 21.06.1952" }
 node Bella_Smith      { type female label "Bella Smith\n* 03.04.1955" }
 node Dave_Smith       { type male   label "Dave Smith\n* 30.05.1986" }
 node Paul_Smith       { type male   label "Paul Smith\n* 28.02.1988" }
 node Susan_Smith      { type female label "Susan Smith\n* 04.06.1995" }
 edge Susan_Smith        John_Smith         { type father }
 edge Paul_Smith         John_Smith         { type father }
 edge Dave_Smith         John_Smith         { type father }
 edge Susan_Smith        Bella_Smith        { type mother }
 edge Paul_Smith         Bella_Smith        { type mother }
 edge Dave_Smith         Bella_Smith        { type mother }
 edge Bella_Smith        John_Smith         { type marriage label 01.03.1985 }
 edge Bella_Smith        Bella_Smith_info   { type info }
 edge John_Smith         John_Smith_info   { type info }
 node John_Smith_info    { type info label "that & this" }
 node Bella_Smith_info   { type info label "this And that" }
 nodetype male    { shape box color #ddddff bordercolor #9999ff width 140 textwidth 20 }
 nodetype female  { shape box color #ffdddd bordercolor #ff9999 width 140 textwidth 20 }
 edgetype father   { color #7777ff backarrowsize 10 backarrowstyle solid arrowsize 0 }
 edgetype mother   { color #ff7777 backarrowsize 10 backarrowstyle solid arrowsize 0 }
 edgetype marriage { kind rightnear arrowstyle line  backarrowstyle line backarrowsize 10 color #ff77ff }
 nodetype info     { color #f0f0f0 borderstyle dashed bordercolor #e0e0e0 }
 edgetype info     { kind near arrowstyle none linestyle dotted color lightgray }
 nodetype 'undefined node' { bordercolor red label '%%?' }
 orientation bottom_to_top
 splines yes

}}

continue with  Wgraph:Sample Genealogy 2 ..