以下のコードは、XamDoughnutChart を WPF アプリケーションに追加する方法を示します。
以下のスクリーンショットは結果のプレビューです。
手順を実行するには、次の NuGet パッケージを参照する WPF アプリケーションが必要です。
Infragistics.WPF.Charts
NuGet フィードのセットアップと NuGet パッケージの追加の詳細については、NuGet フィード ドキュメントを参照してください。
Infragistics xml 名前空間が宣言されている空白のページ:
XAML の場合:
xmlns:ig="http://schemas.infragistics.com/xaml"以下はプロセスの概要です。
1. サンプル データの追加
2. XamDoughnutChart コントロールの追加
3.シリーズの追加
以下の手順は、XamDoughnutChart コントロールをアプリケーションに追加する方法について説明します。
1.サンプル データ モデル クラスを定義します。
ページのコードビハインドでは、以下のクラス定義を追加します。
C# の場合:
public class Category
{
public string Label { get; set; }
public double AveragePrice { get; set; }
}Visual Basic の場合:
Public Class Category
Public Property Label As String
Public Property AveragePrice As Double
End Classこのクラスのインスタンスのリストを作成して、描画された RingSeries 用の ItemsSource として提供します。
2.サンプル データ リストを作成して、ページの DataContext として設定します。
ページのコンストラクターで以下のコードを追加します。
C# の場合:
this.DataContext = new List<Category>()
{
new Category () {Label="Footwear", AveragePrice=52.34},
new Category () {Label="Clothing", AveragePrice=32.2},
new Category () {Label="Accessories", AveragePrice=15.12},
new Category () {Label="Equipment", AveragePrice=39.65}
};Visual Basic の場合:
Me.DataContext = New List(Of Category)() From { _
New Category() With { .Label = "Footwear", .AveragePrice = 52.34 }, _
New Category() With { .Label = "Clothing", .AveragePrice = 32.2 }, _
New Category() With { .Label = "Accessories", .AveragePrice = 15.12 }, _
New Category() With { .Label = "Equipment", .AveragePrice = 39.65 } _
}XamDoughnutChart 宣言をページのルート グリッド要素に追加します。
XAML の場合:
<ig:XamDoughnutChart x:Name="doughnutChart">
</ig:XamDoughnutChart>1.シリーズを追加します。
データを XamDoughnutChart に表示するには、1 つ以上のシリーズをその Series コレクションに追加する必要があります。このプロシージャは 1 つの RingSeries を使用します。
2.必要なプロパティをシリーズに設定します。
シリーズを正しく構成するには、 ItemsSource 、 ValueMemberPath およびオプションで LabelMemberPath および LabelsPosition のプロパティを以下の手順に従って設定する必要があります。
ItemsSource を設定します。
ItemsSource は、シリーズのデータの出所となる IEnumerable プロパティです。 この例では、このプロパティを直接 DataContext にバインドします。
ValueMemberPath を設定します。
ValueMemberPath をそれぞれのスライスのサイズを計算するために使用されるプロパティ名に設定します。このサンプルの場合、プロパティを「AveragePrice」 に設定します。
LabelMemberPath を設定します。
チャートの各スライス用ラベルを取得するために使用されるデータ オブジェクトにおいて、LabelMemberPath をプロパティ名に設定しなければなりません。このサンプルの場合、プロパティを「Label」 に設定します。
LabelsPosition (オプション) を設定します。
LabelsPosition は、このスライスに相対的な位置のラベルを指定します。このサンプルの場合、BestFit に設定します。
XAML の場合:
<ig:XamDoughnutChart x:Name="doughnutChart">
<ig:XamDoughnutChart.Series>
<ig:RingSeries ItemsSource="{Binding}" LabelMemberPath="Label" ValueMemberPath="AveragePrice" LabelsPosition="BestFit"/>
</ig:XamDoughnutChart.Series>
</ig:XamDoughnutChart>以下のトピックでは、このトピックに関連する追加情報を提供しています。