C1OrgChart コントロールは ItemsControl の１つです。通常、このコントロールを使用するには、コントロールの Header または ItemsSource プロパティを設定し、ItemTemplate プロパティを使用して項目の外観を定義します。

いくつかのサブ項目を含む１つのデータ項目がある場合は、Header プロパティを使用します。いくつかのサブ項目を含む項目のコレクションがある場合は、ItemsSource プロパティを使用します。

どちらの方法でも、データ項目にサブ項目を含める必要があります。ほとんどの場合、サブ項目の型はメイン項目と同じになります。たとえば、Employee クラスがあるとすると、このクラスは、この従業員に関するいくつかのプロパティと、この親 Employee の部下にあたる従業員のリストを含む Subordinates プロパティを持つことが考えられます。

public class Employee
{ 
  List<Employee> _list = new List<Employee>(); 
  public string Name { get; set; } 
  public string Position { get; set; } 
  public string Notes { get; set; } 
  public IEnumerable<Employee> Subordinates{ get; set; 

}

１つの Employee オブジェクトを Header プロパティに割り当てると、C1OrgChart は、Subordinates プロパティに Employee オブジェクトのコレクションが含まれていることを自動的に検出します。これだけでデータの階層が確立されます。

データクラスに複数のコレクションプロパティが含まれる場合、またはコレクションが汎用型（IEnumerable など）である場合は、ChildItemsPath プロパティを使用して、子（下位）項目を含むプロパティの名前を指定する必要があります。

項目に含まれるサブ項目の型がそれぞれ異なる場合は、HierarchicalDataTemplate を使用して、レベルごとに項目を指定する必要があります。これについては、このドキュメントの後半で説明します。

ItemTemplate プロパティは、C1OrgChart コントロールにデータ項目を表示する方法を指定します。これは WPF/Sliverlight の標準 DataTemplate で、XAML で次のように定義できます。

<Window.Resources>
   <!-- C1OrgChart ノードコンテンツ -->
   <DataTemplate x:Key="EmployeeTemplate" >
     <Border
       Background="WhiteSmoke" BorderBrush="Black"
       BorderThickness="1 1 2 2" CornerRadius="6"
       MaxWidth="200" >
       <StackPanel Orientation="Vertical" >
         <TextBlock Text="{Binding Name}" FontSize="14" />
         <TextBlock Text="{Binding Notes}" FontSize="9.5" />
         <TextBlock Text="{Binding Position}" FontSize="12" />
       </StackPanel>
     </Border>
  </DataTemplate>
 </Window.Resources>

DataTemplate をリソースとして定義したら、これを C1OrgChart コントロールで次のように使用できます。

<c1:C1OrgChart
   x:Name="_orgChart"
   ItemTemplate="{StaticResource EmployeeTemplate }" >
 </c1:C1OrgChart>

このテンプレートを多少拡張したバージョンと、ランダムに生成された従業員を使用して作成した組織図の例を下に示します。