This diagram models the relationships between the descendants of Japan's Emperor Kōmei. For simply showing descendants, a TreeModel would suffice. However, in making this diagram, one must deal with marriage between descendants as well. Therefore we use the more general GraphLinksModel instead.
Furthermore, we want to display parent-child relationships differently from husband-wife relationships. Although it might be possible to get the desired effect by using a lot of data-binding, it is simpler and more efficient to use two separate templates for rendering link data, instead of just one. This is accomplished by using a DataTemplateDictionary.
<UserControl.Resources > <!-- Other Templates/Converters/etc. --> <go:DataTemplateDictionary x:Key="myLinkTemplateDictionary" > <DataTemplate x:Key="Child" ...> <DataTemplate x:Key="Marriage" ...> </go:DataTemplateDictionary> </UserControl.Resources >
When defining the diagram, instead of setting its LinkTemplate attribute, we set its LinkTemplateDictionary attribute to this DataTemplateDictionary:
<go:Diagram LinkTemplateDictionary="{StaticResource myLinkTemplateDictionary}" ...>
To allow the model's data to select the desired template from the DataTemplateDictionary, one must set the model's LinkCategoryPath to the name of a property of the data type. In this case, we created a new class for link data with a property called Category. So:
... var model = new GraphLinksModel<PersonNode, String, String, PersonLinkData>(); model.LinkCategoryPath = "Category"; ... public class PersonLinkData : GraphLinksModelLinkData<String, String> { public String Category { get; set; } }
In the DataTemplateDictionary, we declared two templates: "Child" and "Marriage". PersonLinkData.Category must have one of those two strings as its value. (It would also be possible to get this effect without adding a Category property to your link data by overriding the GraphLinksModel.FindCategoryForLink method to return either of those two strings, in which case LinkCategoryPath should not be set.)
TreeLayout (and some other layouts) normally set the FromSpot and ToSpot of the links that they route. However in this example we turn that off so that the two link templates can specify their own values differently from each other.