ふにゃるんv2

もとは、http://d.hatena.ne.jp/Wacky/

Microsoft グラフコントロール for .NET を使ってグラフを描きましょう

業務向けなどのアプリケーションをボチボチ作っていると、情報をグラフ化したいなぁ。という要望が出てきます。
そういう場合は大抵、CSVなどのデータに出力して、Excelでグラフ化…というパターンが多いんじゃないかな。と思います。


ただ、Excelでグラフ化だと一手間掛かるのが難点ではありますよね。
アプリケーションでグラフ化できると、それは便利な訳です。


ただ、この「グラフ」という奴。真面目に取り組むと、非常に厄介な代物です。
限定条件下なら手軽に作れるのですが、使い回しを考慮した瞬間、恐ろしい泥沼が待っています。一般の方々にも判り易いUIなので、際限なく要望が各所から沸き出て来ます。
そんな訳で、あまり手を出したくない領域なんですね、「グラフ」という奴は。


そんな訳で、Microsoftさんから、このグラフコントロールが提供されるという話を聞いた時には、もう足を向けて寝られないと思いましたね。

情報源

Microsoft謹製のグラフコントロールですが、主な情報源と提供場所は、以下の通りです。

  1. Microsoft グラフ コントロールVisual Studio 自動コード スニペット
    http://msdn.microsoft.com/ja-jp/magazine/dd569763.aspx
  2. ダウンロードの詳細 : Microsoft Chart Controls for Microsoft .NET Framework 3.5
    http://www.microsoft.com/downloads/details.aspx?displaylang=ja&FamilyID=130f7986-bf49-4fe5-9ca8-910ae6ea442c
  3. Download details: Microsoft Chart Controls Add-on for Microsoft Visual Studio 2008
    http://www.microsoft.com/downloads/details.aspx?familyid=1D69CE13-E1E5-4315-825C-F14D33A303E9&displaylang=en
  4. Download details: Microsoft Chart Controls for .NET Framework Documentation
    http://www.microsoft.com/downloads/details.aspx?FamilyID=ee8f6f35-b087-4324-9dba-6dd5e844fd9f&DisplayLang=en
  5. Samples Environment for Microsoft Chart Controls - Release: Samples Environment for Chart Controls
    http://code.msdn.microsoft.com/mschart/Release/ProjectReleases.aspx?ReleaseId=1591


一番下のサンプルをビルドして実行すると、非常に判り易いチュートリアルが出て来ますので、こちらを見た方が良いでしょう。
細かい使い方は、4.のHTML Helpを見れば良いかなと思います。

使ってみましょう

正直、チュートリアル見りゃ十分なんですが、グラフコントロールの素晴らしさに感動したので、ちょっくら使い方を。

1.インストール

先の情報源の1.と2.のリンク先からファイルをダウンロードして、グラフコントロールをインストールします。

2.フォームにコントロールを貼り付ける

プロジェクトを新規作成して、Windowsフォーム上に Chart コントロールを貼り付けます。

ツールボックスを開いて、「Chart」コントロールを探して、Windowsフォームに貼り付けましょう。
0
0 posted by (C)wacky
 ↓
4
4 posted by (C)wacky

3.ツールボックスに「Chart」コントロールが無い場合

何故か、ツールボックス上に「Chart」コントロールが見つからない場合は、ツールボックスウィンドウ上で右クリックして、「アイテムの選択」を選び。
1
1 posted by (C)wacky

.NET Framework コンポーネント」タグから「Chart」にチェックを入れます。
2
2 posted by (C)wacky

これで、ツールボックスに「Chart」コントロールが出て来ますので、これをWindowsフォームに貼り付けます。
3
3 posted by (C)wacky

4.とりあえず動かす

とりあえず動かしてみましょう。ボタンコントロールWindowsフォーム上に貼り付けて、「ボタン」をダブルクリックして、以下のコードを打ち込みます。

private void button1_Click(object sender, EventArgs e)
{
    Random rnd = new Random();
    for (int i = 0; i < 10; i++)
    {
        double y = rnd.Next(50, 100);
        chart1.Series["Series1"].Points.AddY(y);
    }
}


ビルドして実行すると、以下のようなグラフが出て来ます。
7
7 posted by (C)wacky

5.データがドコに入るのか

グラフ用のデータがドコに入っているのかですが、先のコードの「chart1.Series["Series1"]」で、Seriesオブジェクトにアクセスし、「...Points.AddY(y);」で、Pointsオブジェクト配列に、グラフ用のデータを格納しています。

ここで、PointsオブジェクトはExcelのデータ列に相当し、Seriesオブジェクトは、データ列をグラフ描画した際のグラフ情報(「データ系列の書式設定」に近い)に相当します。
10
10 posted by (C)wacky

6.グラフの書式設定は

Excelの場合、「グラフの種類」でグラフ表示時の形式を帰られます。
11
11 posted by (C)wacky


ラフコントロールの場合は、Seriesオブジェクトの「ChartType」で設定できます。
プロパティウィンドウで、Seriesプロパティを選択し。
5
5 posted by (C)wacky


「ChartType」プロパティから、お好きなグラフ形式を選択します。
8
8 posted by (C)wacky


例えば「Line」を選ぶと、このような折れ線グラフに早変わりです。
9
9 posted by (C)wacky

補足

気になる描画速度ですが、Pentium4 2.6GHzという今では完全にローエンドマシンの環境下で、折れ線グラフを描画すると、以下の感じです。
12
12 posted by (C)wacky

ポイント数 格納と描画に掛かる時間
10,000 137ms
100,000 1,584ms

結構な速度では無いでしょうか?