xamTreemap コントロールによって、ランキングに応じて各ノードのプロパティを操作することができます。これは値マッパーによって実行されます。
xamTreemap コントロールには、以下の事前に定義された値マッパーがあります。
使用例によっては、各ノードのプロパティを設定するためにカスタム ロジックが必要になる場合があります。これはカスタムの値マッパーを作成することによって実行できます。
最初に ValueMapper クラスから派生するのか、それとも RangeMapper クラスから派生するのかを決定する必要があります。RangeMapper クラスは ValueMapper クラスの機能を拡張します。
ValueMapper.Treemap プロパティがシナリオに基づいて xamTreemap コントロールのインスタンスへの参照を提供することに注意してください。これにより制御の程度を高めることができます。
値マッパーは MapValue メソッドを使用して、ノードのランク付けを計算し、マップされたプロパティを設定します。
xamTreemap コントロールはすべてのノードを移動して、各ノードで値マッパーの MapValue メソッドを呼び出します。このメソッドは以下のアクションを担当します。
現在のノードが ValueTypeName タイプかどうかをチェックします。
ノードのデータ コンテキストでロジックを適用します。
マッパーのロジックに基づいて、このメソッドは値を TargetPrpoperty に設定します。
値マッパーが Value Mappers でコレクションから削除されると、マップされたノードそれぞれに対して ResetValue メソッドが実行されます。その目的は、MapValue メソッドが実行される前の元の状態にノードを戻すことです。このため、マッパーが適用される前のノードの状態を知っておく必要があります。
以下の値マッパーは、現在のノードが Product タイプかどうかをチェックします。そうである場合、ノードの塗りつぶしの色はマゼンタ一色に設定されます。
この値マッパーの XAML 宣言がプロパティ ValueTypename または TargetProperty を指定しないことに注意してください。MapValue メソッドでコードされます (ValueTypeName は Product、TargetProperty は Fill)。
Visual Basic の場合:
Public Class CustoMapper
Inherits ValueMapper
Public Overrides Sub MapValue(ByVal node As Infragistics.Controls.Charts.TreemapNode)
If (node.DataContext Is Product) Then
node.Fill = New SolidColorBrush(Colors.Magenta)
End If
End Sub
Public Overrides Sub ResetValue(ByVal node As Infragistics.Controls.Charts.TreemapNode)
End Sub
End Class
C# の場合:
public class CustomMapper : ValueMapper
{
public override void MapValue(TreemapNode node)
{
if (node.DataContext is Product)
{
node.Fill = new SolidColorBrush(Colors.Magenta);
}
} public override void ResetValue(TreemapNode node)
{ }
}
XAML の場合:
<ig:XamTreemap>
<ig:XamTreemap.ValueMappers>
<local:CustomMapper />
</ig:XamTreemap.ValueMappers>
</ig:XamTreemap>
InventoryEntry 要素を表すノードにはテンプレートに縮小された画像 (感嘆符) があります。InventoryEntry の Quantity プロパティが 300 未満の場合、より多くの項目を購入する必要があることをユーザーに警告するために画像が表示されます。
以下の値マッパーでは XAML 宣言で ValueTypeName を設定したことに注意してください。MapValue は文字列 ValueTypeName を、現在のノードのデータ コンテキストと比較します。さまざまなターゲット プロパティの多数のターゲット タイプにマッパーが使用される時に、XAML またはコード ビハインドでマッパーのマッピング プロパティを設定するアプローチ (以前の例のようにハードコード化されない) が役に立ちます。 Visual Basic の場合:
Public Class CustoMapper
Inherits ValueMapper
Public Overrides Sub MapValue(ByVal node As Infragistics.Controls.Charts.TreemapNode)
If (IsDBNull(node.DataContext)) Then
Return
End If
'現在のノードが ValueTypeName であり、そのテンプレートに子があるかどうかをチェックします
If (Me.ValueTypeName = node.DataContext.GetType().Name And VisualTreeHelper.GetChildrenCount(node) > 0) Then
Dim inventoryEntry = CType(node.DataContext, InventoryEntry)
'カスタム ロジック
If (inventoryEntry.Quantity < 300) Then
'ノードのテンプレートから WarningImage のインスタンスを取得します
Dim rootElement = CType(VisualTreeHelper.GetChild(node, 0), FrameworkElement)
Dim warningImage = CType(rootElement.FindName("WarningImage"), Image)
'画像の表示/非表示を設定します
warningImage.Visibility = Visibility.Visible
End If
End If
End Sub
Public Overrides Sub ResetValue(ByVal node As Infragistics.Controls.Charts.TreemapNode)
If (IsDBNull(node.DataContext)) Then
Return
End If
'現在のノードが ValueTypeName であり、そのテンプレートに子があるかどうかをチェックします
If (Me.ValueTypeName = node.DataContext.GetType().Name And VisualTreeHelper.GetChildrenCount(node) > 0) Then
Dim inventoryEntry = CType(node.DataContext, InventoryEntry)
'ノードのテンプレートから WarningImage のインスタンスを取得します
Dim rootElement = CType(VisualTreeHelper.GetChild(node, 0), FrameworkElement)
Dim warningImage = CType(rootElement.FindName("WarningImage"), Image)
'画像の表示/非表示を設定します
warningImage.Visibility = Visibility.Collapsed
End If
End Sub
End Class
C# の場合:
public class VisibilityMapper : ValueMapper
{
public override void MapValue(TreemapNode node)
{
if (node.DataContext == null)
{
return;
}
//現在のノードが ValueTypeName であり、そのテンプレートに子があるかどうかをチェックします
if (this.ValueTypeName == node.DataContext.GetType().Name && VisualTreeHelper.GetChildrenCount(node) > 0)
{
InventoryEntry inventoryEntry = (InventoryEntry)node.DataContext;
//カスタム ロジック
if (inventoryEntry.Quantity < 300)
{
//ノードのテンプレートから WarningImage のインスタンスを取得します
FrameworkElement rootElement = VisualTreeHelper.GetChild(node, 0) as FrameworkElement;
Image warningImage = rootElement.FindName("WarningImage") as Image;
//画像の表示/非表示を設定します
warningImage.Visibility = Visibility.Visible;
}
}
}
public override void ResetValue(TreemapNode node)
{
if (node.DataContext == null)
{
return;
}
//現在のノードが ValueTypeName であり、そのテンプレートに子があるかどうかをチェックします
if (this.ValueTypeName == node.DataContext.GetType().Name && VisualTreeHelper.GetChildrenCount(node) > 0)
{
InventoryEntry inventoryEntry = (InventoryEntry)node.DataContext;
//ノードのテンプレートから WarningImage のインスタンスを取得します
FrameworkElement rootElement = VisualTreeHelper.GetChild(node, 0) as FrameworkElement;
Image warningImage = rootElement.FindName("WarningImage") as Image;
//画像を縮小します。
warningImage.Visibility = Visibility.Collapsed;
}
}
}
XAML の場合:
<ig:XamTreemap>
<ig:XamTreemap.ValueMappers>
<local:VisibilityMapper ValueTypeName="InventoryEntry" />
</ig:XamTreemap.ValueMappers>
</ig:XamTreemap>
関連トピック