アプリケーションに表現力豊かなグラフを実装する

True WinChart for .NETコンポーネントによる豊かな表現のグラフ作成

　アプリケーションでデータを表示する際に、表現力豊かなグラフを使えれば、プログラムの見映えがよくなるだけでなく、よりデータの説得力が増すのではないかと考えたことはありませんか？ 今回はTrue WinChart for .NETというコンポーネントを利用し、複合グラフや強調表示など、表現力豊かなグラフを作成するためのTipsを紹介します。

はじめに

　アプリケーションでデータを表示する際に、表現力豊かなグラフを使えれば、プログラムの見映えがよくなるだけでなく、よりデータの説得力が増すのではないかと考えたことはありませんか？

　例えば、1つのデータ群を複合グラフで表示したり、データ点のラベルやマーカーにグラフィックスを使うことができれば、ユーザーが受ける印象がぐっとよくなっていき、アプリケーションの機能も高度なものに見えてきます。

　そこで、今回はTrue WinChart for .NETコンポーネントを使って、表現力豊かなグラフを作成するためのTipsを紹介します。

2種類のグラフでデータを表示する

マウスを重ねるとグラフの色が変わる

データ点にラベルを表示

対象読者

　Visual Basic 2005またはVisual C# 2005を使って、プログラムを作ったことがある人。

必要な環境

　Visual Basic 2005またはVisual C# 2005、Visual Studio 2005でプログラムが作れる環境。

プログラム実行時の注意事項

　本稿の実行ファイル（バイナリファイル）を動かすには、zipファイルに同梱してある以下のファイルが必要になります。

• C1.Win.C1Chart.2.dll
……C1Chartコントロール（.NET Framework 2.0用）
• C1.Win.C1Chart3D.2.dll
……C1Chart3Dコントロール（.NET Framework 2.0用）

　これらのファイルを、実行プログラムと同じフォルダに格納します。

　また、.NET Framework 2.0から追加されたクラスやメンバを使用しているので、.NET Framework 2.0がインストールされていることが必須条件です。

コンポーネントのインストール

　はじめてTrue WinChart for .NETを使用する方は、プロジェクトにTrue WinChart for .NETをインストールする必要があります。

　インストーラは、グレープシティ社のWebページからダウンロードできますので、ここからダウンロードしてインストールしてください。製品ページ左側の［ダウンロード］-［トライアル版］をクリックし、ダウンロード方法（［FTP］または［HTTP］）を選択します。ファイルはLZH形式で圧縮されています。

　有償のコンポーネントですが、プロダクトキーを入力せずにインストールすることで、トライアル版として使用できます。制限事項などの詳細については、インストーラに同梱されているリリースノートを参照ください。

コントロールの追加

　True WinChart for .NETをインストールしたら、ツールボックスに専用のタブを作成し、True WinChart for .NETのコンポーネントを追加します。追加するコンポーネントは、［.NET Frameworkコンポーネント］の［名前空間］が「C1.Win.C1」で始まる名前空間のコンポーネントです。

「C1.Win.C1」で始まる名前空間のコンポーネントを追加する

複合グラフの作成

　2種類のデータの因果関係など、データの傾向を調べる際によく使われるのが複合グラフです。例えば、前年7月の平均日照時間と花粉の飛散量を都道府県別に比較してみる、などという場合は、複合グラフをよく使用します。

　このグラフを作成するには、データ用配列とChartGroupオブジェクト、ChartDataSeriesオブジェクトを2組作成します。

2つのデータを1つのグラフで表示する

軸の範囲とタイトルの設定

　グラフ作成にあたって、まずはデータの範囲と軸のタイトルを設定します。データの範囲は、C1ChartコンポーネントのAxisYクラスのMin・Maxプロパティを使用します。複合グラフでは、AxisY2クラスも使用して2種類のデータの範囲を設定します。

VB.NETのコード

Me.C1Chart1.ChartArea.AxisY.Min = 50
Me.C1Chart1.ChartArea.AxisY.Max = 200
Me.C1Chart1.ChartArea.AxisY2.Min = 700
Me.C1Chart1.ChartArea.AxisY2.Max = 3000

C#のコード

c1Chart1.ChartArea.AxisY.Min = 50;
c1Chart1.ChartArea.AxisY.Max = 200;
c1Chart1.ChartArea.AxisY2.Min = 700;
c1Chart1.ChartArea.AxisY2.Max = 3000;

　軸のタイトルは、同じクラスのTextプロパティを使用します。X軸はAxisXクラスになります。

VB.NETのコード

Me.C1Chart1.ChartArea.AxisX.Text = "都道府県名"
Me.C1Chart1.ChartArea.AxisY.Text = "日照時間"
Me.C1Chart1.ChartArea.AxisY2.Text = "飛散量"

C#のコード

c1Chart1.ChartArea.AxisX.Text = "都道府県名";
c1Chart1.ChartArea.AxisY.Text = "日照時間";
c1Chart1.ChartArea.AxisY2.Text = "飛散量";

　また、チャートのタイトルはC1ChartクラスのTextプロパティで設定します。

VB.NETのコード

Me.C1Chart1.Text = "前年7月の平均日照時間と花粉の飛散量"

C#のコード

c1Chart1.Text = "前年7月の平均日照時間と花粉の飛散量";

データの作成

　複合グラフでは、2つのデータとX軸のラベルを設定しますので、3つの配列を作成します。

VB.NETのコード

Dim datanum() As String = _
   New String(MAXNUM) {"山形", " 東京", "名古屋", "大阪", "高松", _
      "岡山", "鹿児島"}
Dim datavalue1() As Single = _
   New Single(MAXNUM) {73, 59.2, 118.5, 107.9, 120.0, 101.5, 200}
Dim datavalue2() As Single = _
   New Single(MAXNUM) {1292, 1037, 795, 2451, 2984, 1502, 1669}

C#のコード

String[] datanum = new String[]{"山形", " 東京", "名古屋", "大阪",
   "高松", "岡山", "鹿児島"};
double[] datavalue1 = new double[]{73, 59.2, 118.5, 107.9,
   120.0, 101.5, 200};
double[] datavalue2 = new double[] {1292, 1037, 795, 2451,
   2984, 1502, 1669};

　作成したデータ配列を元に、ChartDataSeriesオブジェクトを2つ作成します。

VB.NETのコード

Dim series1 As C1.Win.C1Chart.ChartDataSeries = _
   Me.C1Chart1.ChartGroups(0).ChartData.SeriesList.AddNewSeries()
Dim series2 As C1.Win.C1Chart.ChartDataSeries = _
   Me.C1Chart1.ChartGroups(1).ChartData.SeriesList.AddNewSeries()

C#のコード

C1.Win.C1Chart.ChartDataSeries series1 =
   c1Chart1.ChartGroups.Group0.ChartData.SeriesList.AddNewSeries();
C1.Win.C1Chart.ChartDataSeries series2 =
   c1Chart1.ChartGroups.Group1.ChartData.SeriesList.AddNewSeries();

グラフの種類を変更する

　C1Chartコンポーネントは、フォームに配置した時点では折れ線グラフがデフォルトのグラフに設定されています。今回は、折れ線グラフと縦棒グラフの複合グラフとしますので、グラフの1つを変更します。

　グラフの種類は、それぞれのChartGroupsオブジェクトのChartTypeプロパティで変更します。設定値は、「Chart2DTypeEnum列挙体」のメンバで指定します。2Dの縦棒グラフは「Bar」です。

VB.NETのコード

Me.C1Chart1.ChartGroups(1).ChartType = _
   C1.Win.C1Chart.Chart2DTypeEnum.Bar

C#のコード

c1Chart1.ChartGroups.Group1.ChartType =
   C1.Win.C1Chart.Chart2DTypeEnum.Bar;

Chart2DTypeEnum列挙体のメンバ

メンバ名	説明
Area	エリアグラフ
Bar	棒グラフ
Bubble	バブルチャート
Candle	ローソク足チャート
Gantt	ガントチャート
HiLo	HiLoチャート
HiLoOpenClose	HiLoOpenCloseチャート
Histogram	ヒストグラム
Pie	円グラフ
Polar	ポーラチャート
Radar	レーダーチャート
Step	階段グラフ
XYPlot	プロットグラフ

データをグラフにセット

　最後にデータ配列をChartDataSeriesオブジェクトに設定して出来上がりです。

VB.NETのコード

series1.X.CopyDataIn(datanum)
series2.X.CopyDataIn(datanum)
series1.Y.CopyDataIn(datavalue1)
series2.Y.CopyDataIn(datavalue2)

C#のコード

series1.X.CopyDataIn(datanum);
series2.X.CopyDataIn(datanum);
series1.Y.CopyDataIn(datavalue1);
series2.Y.CopyDataIn(datavalue2);