FlexGridのデータをC1Chartに連携してみる
FlexGridとC1Chartのデータ連携は、先ほど作成したSalesDataListクラスにて行います。メイン画面のFlexGridに表示されているデータから、SalesDataクラスを生成し、配列としてSalesDataListクラスを生成します。
データクラスの受け渡しには、プロパティを利用します。今回追加したFormクラスにプロパティを追加します。
public SalesDataList SalesDataList
{
get { return this._salesDataList; }
set { this._salesDataList = value; }
}
プロパティでセットされた値をBindingSourceのデータソースとして設定することで、グラフの表示を行うことができます。
this.bindingSource1.DataSource = "データの配列";
表示するデータを変更する
ここで、一工夫してみましょう。先ほどまでの場合は、FlexGridから渡されたすべてのデータがグラフに表示されている状態になっていました。
そこで、カテゴリを選択し表示するデータを絞り込むようにします。データの表示は先ほどと同様に、BindingSourceのデータソースを設定するだけになります。設定するデータソースは、表示させたいものになるように加工しておきます。
public SalesDataList SelectCategory(string code)
{
SalesDataList value = new SalesDataList();
List<SalesData> list = this.FindAll(delegate(SalesData data)
{
return (data.CategoryCode == code);
});
value.AddRange(list);
return value;
}
データクラスには、カテゴリを指定して絞り込みが行えるメソッドを追加します。
this.bindingSource1.DataSource = this._salesDataList.SelectCategory("指定するカテゴリコード");
どうでしょうか？ カテゴリごとのデータが表示されたかと思います。
表示されているグラフの種類を変更してみる
C1Chartコントロールには、たくさんの種類のグラフが用意されています。ここでは、複数用意されている種類の中から、折れ線グラフと棒グラフを表示してみましょう。
画面のRibbonTabにComboBoxを追加し、グラフの種類を選択できるようにします。ここで折れ線グラフ、棒グラフを切り替えられるようにします。
グラフの種類を指定するにはChartTypeプロパティを指定します。設定値はChart2DTypeEnum列挙体で指定を行い、折れ線グラフの場合はChart2DTypeEnum.XYPlotを、棒グラフの場合はChart2DTypeEnum.Barを設定します。
棒グラフを選択したのが下の画像です。
プロパティの設定だけで、再描画まで実行されることが確認できると思います。
