C#

【C#】Chartコントロールをとりあえず使ってみる

Chartコントロールは、本当に多くのプロパティがあるため、一つ一つを調べてからプログラムをするよりも、まずはVisual Studioのフォームエディタ上でいろいろ触ってみてから、プロパティの意味するところを覚えて、プログラムを組むようにした方が早そうです。

 

という事で、フォームエディタ上で、いろいろ触ってみました。

 

コントロールの追加

ツールボックスのデータの中にあるChartを選択し、フォームへ追加します。

 

C# Chart Control

 

グラフデータの追加

グラフのデータはSeriesプロパティで管理されています。

C# Chart Control

 

Series(コレクション)の部分をクリックし、  をクリックするとエディタが表示されます。

 

C# Chart Control

 

グラフのデータはデータPointsプロパティの(コレクション)の部分をクリックし、  をクリックすると各データを編集する画面↓が表示されます。

 

C# Chart Control

 

追加のボタンをクリックするたびにデータが追加されます。

下図は5個のデータを追加した様子

 

C# Chart Control

 

各データの値はデータのXValueとYValuesの値を設定します。

ここでYの値だけ複数形になっている?!と思えたら、少しChartコントロールに慣れてきている感じでしょうか?

複数形は複数の設定ができます。

 

この状態で5個のデータを表示したのがこちら↓

 

C# Chart Control

 

グラフの種類の設定

グラフの種類は各系列(Series)ごとに設定ができ(できない組み合わせもあります)、グラフのChartTypeで設定します。

 

C# Chart Control

 

ここで、縦の棒グラフ(Column)から折れ線グラフ(Line)に変更すると

 

C# Chart Control

 

上図のようになります。

 

マーカーの追加

マーカーはSeriesプロパティのMakerSyleというプロパティがあります。

C# Chart Control

 

デフォルトではマーカーなし(None)になっていますが、これをSquareにしてみます。

C# Chart Control

エクセルっぽい!

 

軸の名前の設定

グラフの軸を管理しているのはChartAreaプロパティになります。

ChartArea(コレクション)の部分をクリックし、  をクリックするとエディタが表示されます。

 

軸を管理しているのがAxesプロパティでさらにエディタを開きます。

 

C# Chart Control

 

Axisコレクションには最初から

X axis X軸(主軸)
Y(Value) axis Y軸(主軸)
Secondary X axis X軸(第二軸)
Secondary Y axis Y軸(第二軸)

の4つが用意されており、各軸のTitleプロパティで軸の名前を設定します。

 

C# Chart Control

 

X軸とY軸のTitleを設定した結果↓

 

C# Chart Control

 

グラフのタイトルの設定

グラフのタイトルはTitleプロパティになります。

Title(コレクション)の部分をクリックし、  をクリックするとエディタが表示されます。

 

C# Chart Control

 

(Text)の部分を編集するとグラフのタイトルが表示されます。

C# Chart Control

 

凡例領域の設定

凡例領域の設定はLegendsロパティになります。

Legends(コレクション)の部分をクリックし、  をクリックするとエディタが表示されます。

 

C# Chart Control

 

Legends1のTitleプロパティに凡例表示と入力してみると

 

C# Chart Control

 

ん??

Series1の部分が変わるかと思ったら、その上に表示されるだけ?

Legendsプロパティはあくまでも凡例表示全体(各系列の凡例を表示している領域)のプロパティ設定であって、各系列(Series)の設定ではありません。

 

Series1の部分の表示名を変更するにはSeriesプロパティのNameプロパティを設定します。

 

C# Chart Control

 

凡例の名前が変更されました↓

C# Chart Control

 

他にも様々なプロパティがあるので、いじりたおすと面白いと思います。

 

これで、この操作をプログラムで表現できれば、何とかなりそうな気がしてきた!

 

Chartコントロールの使用方法へ戻る

コメント

タイトルとURLをコピーしました