C#でグラフを作成する方法|Chartコントロール・折れ線・棒グラフを初心者向けに解説
はじめに
C#でグラフを作成したい場合、初心者にとって最も始めやすい方法は、Windows FormsのChartコントロールを使う方法です。
Chartコントロールを使うと、折れ線グラフ、棒グラフ、円グラフ、散布図などを比較的少ないコードで表示できます。売上データ、在庫数、センサー値、集計結果などを画面上にグラフ化したいときに便利です。
この記事では、「c# グラフ」で調べている初心者向けに、C#でグラフを作成する基本から、Chartコントロールの使い方、折れ線グラフ・棒グラフのサンプルコード、データを動的に表示する方法、よくあるエラーの解決方法まで解説します。
1. C#でグラフを作成する方法の全体像
C#でグラフを作成する方法はいくつかあります。代表的なのは、Windows FormsのChartコントロールを使う方法、WPF向けのグラフライブラリを使う方法、ASP.NETでWeb画面にグラフを表示する方法、外部ライブラリを利用する方法です。
中でも、デスクトップアプリで手軽にグラフを表示したい場合は、Windows FormsのChartコントロールがわかりやすいです。Microsoft Learnでも、ChartクラスはWindows FormsのChartコントロールに関するプロパティ、メソッド、イベントを公開するクラスとして説明されています。
1-1. C#で作れる主なグラフの種類
C#では、次のようなグラフを作成できます。
折れ線グラフは、時間の経過による変化を表すのに向いています。売上推移、気温変化、アクセス数の推移などに使えます。
棒グラフは、カテゴリごとの数値を比較するのに向いています。月別売上、商品別販売数、部署別人数などを見せるときに便利です。
円グラフは、全体に対する割合を見せるのに向いています。カテゴリ別の構成比やアンケート結果などに使えます。
散布図は、2つの数値の関係を確認するのに向いています。温度と売上、身長と体重、センサー値の相関などを確認できます。
面グラフは、折れ線グラフに面を塗ったグラフです。推移とボリューム感を同時に見せたい場合に使えます。
積み上げ棒グラフは、合計値と内訳を同時に見せたい場合に便利です。
1-2. Chartコントロールでできること
Chartコントロールでは、グラフの種類を指定し、データを追加するだけで基本的なグラフを作成できます。
たとえば、折れ線グラフを作る場合は、SeriesChartType.Lineを指定します。縦棒グラフを作る場合はSeriesChartType.Column、横棒グラフを作る場合はSeriesChartType.Barを指定します。SeriesChartTypeにはLine、Bar、Column、Pie、Point、Area、StackedColumnなど複数のグラフ種類が用意されています。
Chartコントロールでは、主に次のような操作ができます。
グラフの種類を変更する、データ点を追加する、複数系列を表示する、タイトルを設定する、凡例を表示する、軸ラベルを設定する、色や線の太さを変更する、マーカーを表示する、グラフを画像として保存する、といった処理です。
1-3. 初心者はWindows FormsのChartコントロールから始めるのがおすすめ
C#で初めてグラフを作るなら、Windows FormsのChartコントロールから始めるのがおすすめです。
理由は、フォームにChartコントロールを配置し、コードでSeriesにデータを追加するだけでグラフを表示できるからです。WPFやWebアプリに比べると、画面設計とコードの対応関係がわかりやすく、初心者でも動作を確認しやすいです。
特に、次のような目的であればChartコントロールで十分です。
社内ツールで簡単なグラフを表示したい、CSVの数値データを可視化したい、売上や在庫数をグラフ化したい、Windowsデスクトップアプリで折れ線グラフや棒グラフを作りたい、という場合です。
1-4. WPF・ASP.NET・コンソールアプリでグラフを作りたい場合の考え方
WPFでグラフを作りたい場合は、ChartコントロールよりもWPF向けの外部ライブラリを使うことが多いです。代表例として、OxyPlotやLiveChartsなどがあります。
ASP.NETでグラフを表示したい場合は、サーバー側のC#でデータを用意し、JavaScriptのChart.jsなどでブラウザ上に描画する方法がよく使われます。
コンソールアプリの場合、画面上に本格的なグラフを表示するよりも、CSVや画像ファイルとして出力する方法が現実的です。コンソール上に簡易的なテキストグラフを出すこともできますが、視覚的に見やすいグラフが必要なら、画像出力やGUIアプリ化を検討しましょう。
2. C#のChartコントロールとは
C#のChartコントロールとは、Windows Formsアプリでグラフを表示するためのコントロールです。
フォーム上にButtonやTextBoxを配置するように、Chartコントロールを配置して使います。コード側では、グラフエリア、系列、データ点、凡例、タイトルなどを設定します。
2-1. Chartコントロールの基本機能
Chartコントロールの基本は、次の3つです。
まず、ChartAreaでグラフを描画する領域を用意します。次に、Seriesで表示したいデータ系列を作成します。最後に、Series.Points.AddXYなどでデータを追加します。
たとえば、月別売上を折れ線グラフで表示する場合は、「売上」というSeriesを作り、「1月」「2月」「3月」といったX軸の値と、100、150、130といったY軸の値を追加します。
2-2. ChartArea・Series・Legend・Titleの役割
Chartコントロールでは、ChartArea、Series、Legend、Titleの役割を理解すると、グラフ作成がかなりわかりやすくなります。
ChartAreaは、グラフを描画するエリアです。軸、目盛り、軸ラベル、プロット領域などを含みます。Microsoft Learnでは、ChartAreaはプロット位置、目盛り、軸ラベル、軸タイトルを含む四角形の領域として説明されています。
Seriesは、グラフに表示するデータのまとまりです。たとえば、「売上」「利益」「前年売上」のように、1つのグラフ内に複数のSeriesを追加できます。Seriesには、データ点だけでなく、グラフ種類、色、線の太さ、マーカーなどの設定も含まれます。
Legendは凡例です。複数のSeriesを表示するときに、「青い線は売上」「オレンジの線は利益」のように、どのグラフが何を表しているかを表示します。
Titleはグラフタイトルです。「月別売上推移」「商品別販売数」など、グラフの内容をわかりやすく示します。
2-3. 折れ線グラフ・棒グラフ・円グラフなどのChartType
Chartコントロールでは、SeriesのChartTypeを変更することでグラフの種類を切り替えます。
代表的なChartTypeは次のとおりです。
C#SeriesChartType.Line // 折れ線グラフ
SeriesChartType.Column // 縦棒グラフ
SeriesChartType.Bar // 横棒グラフ
SeriesChartType.Pie // 円グラフ
SeriesChartType.Point // 散布図
SeriesChartType.Area // 面グラフ
SeriesChartType.StackedColumn // 積み上げ縦棒グラフ
同じデータでも、ChartTypeを変えるだけで見せ方が大きく変わります。時系列データなら折れ線グラフ、カテゴリ比較なら棒グラフ、割合なら円グラフを選ぶとよいでしょう。
2-4. Chartコントロールを使うメリットと注意点
Chartコントロールのメリットは、標準的なグラフを短いコードで作成できることです。折れ線グラフや棒グラフなら、数十行のコードで表示できます。
また、Windows Formsアプリであれば、画面上に直接グラフを配置できるため、デスクトップ業務アプリとの相性がよいです。
一方で、注意点もあります。モダンなデザインや高度なアニメーション、Webアプリでの表示、WPFでの柔軟なUI連携などを求める場合は、外部ライブラリのほうが向いていることがあります。
また、.NET FrameworkのWindows Formsでは使いやすい一方、.NET Core、.NET 5以降、.NET 8などの環境では、プロジェクト種類やパッケージの有無によってChartコントロールがツールボックスに表示されない場合があります。Microsoft Q&Aでも、.NET 8のWindows FormsでChartを使う場合にNuGetパッケージの利用が案内されています。
3. C#でグラフを作成する準備
ここでは、Visual StudioでWindows Formsアプリを作成し、Chartコントロールを配置する準備を解説します。
3-1. Visual StudioでWindows Formsアプリを作成する
まず、Visual Studioを起動し、新しいプロジェクトを作成します。
初心者がChartコントロールを使う場合は、「Windows Forms App」または「Windows フォーム アプリケーション」を選びます。
Chartコントロールを確実に使いたい場合は、まず.NET Framework版のWindows Formsアプリで試すとわかりやすいです。.NET 5以降のWindows Formsでは、環境によってChartコントロールの追加方法が異なる場合があるためです。
プロジェクトを作成したら、Form1.csのデザイン画面を開きます。
3-2. フォームにChartコントロールを配置する
Visual StudioのツールボックスからChartコントロールを探し、フォームにドラッグアンドドロップします。
配置したChartコントロールの名前は、初期状態ではchart1になっていることが多いです。この記事のサンプルコードでは、フォーム上にchart1という名前のChartコントロールが配置されている前提で解説します。
フォームのLoadイベントにコードを書く場合は、Form1_Loadにグラフ初期化処理を記述します。
C#private void Form1_Load(object sender, EventArgs e)
{
// ここにグラフ作成処理を書く
}
3-3. 必要な名前空間を確認する
Chartコントロールをコードで操作するには、次の名前空間を使います。
C#using System;
using System.Drawing;
using System.Windows.Forms;
using System.Windows.Forms.DataVisualization.Charting;
特に重要なのは、次の名前空間です。
C#using System.Windows.Forms.DataVisualization.Charting;
この名前空間を追加すると、ChartArea、Series、Legend、SeriesChartTypeなどを簡単に扱えるようになります。
3-4. Chartコントロールが表示されない場合の確認ポイント
ツールボックスにChartコントロールが表示されない場合は、次の点を確認してください。
まず、プロジェクトの種類を確認します。Windows Formsアプリではなく、コンソールアプリやWPFアプリを作成している場合、Chartコントロールはそのままでは使えません。
次に、.NET Framework版か、.NET 5以降のWindows Formsかを確認します。.NET Framework版ではChartコントロールを使いやすいですが、.NET 5以降では環境によって追加のパッケージが必要になることがあります。
また、ツールボックスを右クリックして「アイテムの選択」を開き、Chartが選択可能か確認する方法もあります。
それでも表示されない場合は、参照設定にSystem.Windows.Forms.DataVisualizationが含まれているか確認しましょう。
4. C#で折れ線グラフを作成する方法
折れ線グラフは、C#でグラフを作成するときによく使うグラフの1つです。時間の流れに沿って数値がどのように変化したかを表すのに向いています。
4-1. 折れ線グラフの完成イメージ
ここでは、月別売上を折れ線グラフで表示する例を作成します。
X軸には「1月」「2月」「3月」「4月」「5月」を表示し、Y軸には売上金額を表示します。グラフ上にはデータ点を結ぶ線が表示され、売上が増えた月、減った月がひと目でわかるようになります。
4-2. Seriesを初期化してデータを追加する
折れ線グラフを作るには、まずSeriesを作成します。
C#Series series = new Series("売上");
次に、データを追加します。
C#series.Points.AddXY("1月", 120);
series.Points.AddXY("2月", 150);
series.Points.AddXY("3月", 130);
AddXYの第1引数がX軸の値、第2引数がY軸の値です。
4-3. SeriesChartType.Lineで折れ線グラフを指定する
Seriesを折れ線グラフとして表示するには、ChartTypeにSeriesChartType.Lineを指定します。
C#series.ChartType = SeriesChartType.Line;
これだけで、Seriesに追加したデータが折れ線グラフとして描画されます。
4-4. X軸・Y軸の値を設定する
X軸には月名や日付、時刻などを設定できます。Y軸には売上、温度、数量などの数値を設定します。
軸タイトルを表示したい場合は、ChartAreaのAxisX.Title、AxisY.Titleを使います。
C#chart1.ChartAreas[0].AxisX.Title = "月";
chart1.ChartAreas[0].AxisY.Title = "売上";
目盛りの間隔を変更したい場合は、Intervalを使います。
C#chart1.ChartAreas[0].AxisY.Interval = 50;
4-5. 折れ線グラフのサンプルコード
次のコードは、C#のChartコントロールで折れ線グラフを作成する基本例です。
C#using System;
using System.Drawing;
using System.Windows.Forms;
using System.Windows.Forms.DataVisualization.Charting;
namespace ChartSample
{
public partial class Form1 : Form
{
public Form1()
{
InitializeComponent();
}
private void Form1_Load(object sender, EventArgs e)
{
chart1.Series.Clear();
chart1.ChartAreas.Clear();
chart1.Titles.Clear();
ChartArea area = new ChartArea("MainArea");
area.AxisX.Title = "月";
area.AxisY.Title = "売上";
chart1.ChartAreas.Add(area);
Series series = new Series("売上");
series.ChartType = SeriesChartType.Line;
series.BorderWidth = 3;
series.MarkerStyle = MarkerStyle.Circle;
series.MarkerSize = 8;
series.Points.AddXY("1月", 120);
series.Points.AddXY("2月", 150);
series.Points.AddXY("3月", 130);
series.Points.AddXY("4月", 180);
series.Points.AddXY("5月", 210);
chart1.Series.Add(series);
chart1.Titles.Add("月別売上推移");
}
}
}
このコードを実行すると、月別売上を表す折れ線グラフが表示されます。
ポイントは、SeriesChartType.Lineを指定している部分です。また、MarkerStyleを設定することで、各データ点を丸印で表示しています。
4-6. 複数系列の折れ線グラフを表示する方法
複数の折れ線を表示したい場合は、Seriesを複数作成します。
たとえば、「今年の売上」と「前年の売上」を比較する場合は、次のように書きます。
C#chart1.Series.Clear();
chart1.ChartAreas.Clear();
chart1.ChartAreas.Add(new ChartArea("MainArea"));
Series thisYear = new Series("今年");
thisYear.ChartType = SeriesChartType.Line;
thisYear.BorderWidth = 3;
thisYear.Points.AddXY("1月", 120);
thisYear.Points.AddXY("2月", 150);
thisYear.Points.AddXY("3月", 130);
Series lastYear = new Series("前年");
lastYear.ChartType = SeriesChartType.Line;
lastYear.BorderWidth = 3;
lastYear.Points.AddXY("1月", 100);
lastYear.Points.AddXY("2月", 130);
lastYear.Points.AddXY("3月", 125);
chart1.Series.Add(thisYear);
chart1.Series.Add(lastYear);
複数系列を表示するときは、Seriesの名前をわかりやすくすることが重要です。凡例にSeries名が表示されるため、「系列1」「系列2」のような名前ではなく、「今年」「前年」「売上」「利益」のように意味のある名前にしましょう。
5. C#で棒グラフを作成する方法
棒グラフは、カテゴリごとの数値を比較したいときに便利です。C#のChartコントロールでは、縦棒グラフと横棒グラフの両方を作成できます。
5-1. 棒グラフの完成イメージ
ここでは、商品別販売数を棒グラフで表示する例を作成します。
X軸には「商品A」「商品B」「商品C」「商品D」を表示し、Y軸には販売数を表示します。棒の高さを比較することで、どの商品が多く売れているかを確認できます。
5-2. SeriesChartType.Columnで縦棒グラフを作成する
縦棒グラフを作成するには、ChartTypeにSeriesChartType.Columnを指定します。
C#series.ChartType = SeriesChartType.Column;
Columnは、カテゴリを横方向に並べ、数値を縦方向の棒で表します。月別売上や商品別販売数など、多くの場面で使いやすいグラフです。
5-3. SeriesChartType.Barで横棒グラフを作成する
横棒グラフを作成するには、ChartTypeにSeriesChartType.Barを指定します。
C#series.ChartType = SeriesChartType.Bar;
Barは、カテゴリを縦方向に並べ、数値を横方向の棒で表します。カテゴリ名が長い場合や、ランキングを表示したい場合に向いています。
5-4. カテゴリ名と数値データを設定する
棒グラフでは、X軸にカテゴリ名、Y軸に数値を設定することが多いです。
C#series.Points.AddXY("商品A", 80);
series.Points.AddXY("商品B", 120);
series.Points.AddXY("商品C", 95);
このように書くと、商品ごとの販売数を棒グラフで表示できます。
5-5. 棒グラフのサンプルコード
次のコードは、C#で縦棒グラフを作成する基本例です。
C#private void Form1_Load(object sender, EventArgs e)
{
chart1.Series.Clear();
chart1.ChartAreas.Clear();
chart1.Titles.Clear();
ChartArea area = new ChartArea("MainArea");
area.AxisX.Title = "商品";
area.AxisY.Title = "販売数";
chart1.ChartAreas.Add(area);
Series series = new Series("販売数");
series.ChartType = SeriesChartType.Column;
series.Points.AddXY("商品A", 80);
series.Points.AddXY("商品B", 120);
series.Points.AddXY("商品C", 95);
series.Points.AddXY("商品D", 150);
chart1.Series.Add(series);
chart1.Titles.Add("商品別販売数");
}
横棒グラフにしたい場合は、次の1行を変更するだけです。
C#series.ChartType = SeriesChartType.Bar;
5-6. 複数データを比較する棒グラフの作り方
複数データを比較する棒グラフでは、Seriesを複数追加します。
たとえば、商品別に「今年」と「前年」の販売数を比較する場合は、次のように書きます。
C#chart1.Series.Clear();
chart1.ChartAreas.Clear();
chart1.ChartAreas.Add(new ChartArea("MainArea"));
Series thisYear = new Series("今年");
thisYear.ChartType = SeriesChartType.Column;
thisYear.Points.AddXY("商品A", 80);
thisYear.Points.AddXY("商品B", 120);
thisYear.Points.AddXY("商品C", 95);
Series lastYear = new Series("前年");
lastYear.ChartType = SeriesChartType.Column;
lastYear.Points.AddXY("商品A", 70);
lastYear.Points.AddXY("商品B", 110);
lastYear.Points.AddXY("商品C", 100);
chart1.Series.Add(thisYear);
chart1.Series.Add(lastYear);
これで、商品ごとに今年と前年の棒が並んで表示されます。
6. グラフを見やすくカスタマイズする方法
グラフは、データを表示するだけでは不十分です。タイトル、軸ラベル、凡例、色、線の太さ、グリッド線などを調整すると、見やすく伝わりやすいグラフになります。
6-1. グラフタイトルを表示する
グラフタイトルは、Titles.Addで追加できます。
C#chart1.Titles.Clear();
chart1.Titles.Add("月別売上推移");
タイトルを設定することで、グラフが何を表しているのかがすぐにわかります。
文字サイズやフォントを変更したい場合は、Titleオブジェクトを作成します。
C#Title title = new Title("月別売上推移");
title.Font = new Font("Meiryo", 14, FontStyle.Bold);
chart1.Titles.Add(title);
6-2. 凡例を表示・非表示にする
凡例は、複数のSeriesを表示するときに役立ちます。
凡例を表示する場合は、次のようにLegendを追加します。
C#chart1.Legends.Clear();
chart1.Legends.Add(new Legend("Legend1"));
凡例を非表示にしたい場合は、SeriesのIsVisibleInLegendをfalseにします。
C#series.IsVisibleInLegend = false;
1つの系列しかないグラフでは、凡例を非表示にしたほうがすっきり見えることがあります。
6-3. 軸ラベルと目盛りを設定する
軸ラベルを設定すると、X軸とY軸が何を表しているのかがわかりやすくなります。
C#ChartArea area = chart1.ChartAreas[0];
area.AxisX.Title = "月";
area.AxisY.Title = "売上";
目盛りの間隔を指定する場合は、Intervalを使います。
C#area.AxisY.Interval = 50;
Y軸の最小値と最大値を指定することもできます。
C#area.AxisY.Minimum = 0;
area.AxisY.Maximum = 300;
6-4. グラフの色や線の太さを変更する
折れ線グラフの線の太さを変更するには、BorderWidthを使います。
C#series.BorderWidth = 3;
色を変更するには、Colorを指定します。
C#series.Color = Color.Blue;
棒グラフの場合も、SeriesのColorを指定すると棒の色を変更できます。
C#series.Color = Color.SteelBlue;
色を使いすぎると見づらくなるため、比較したいデータごとに意味のある色を選びましょう。
6-5. マーカーを表示してデータ点を見やすくする
折れ線グラフでは、マーカーを表示すると各データ点がわかりやすくなります。
C#series.MarkerStyle = MarkerStyle.Circle;
series.MarkerSize = 8;
マーカーの色を変えることもできます。
C#series.MarkerColor = Color.Red;
データ点が多すぎる場合は、マーカーを表示すると逆に見づらくなることがあります。データ数に応じて使い分けましょう。
6-6. グリッド線を調整する
グリッド線は、値を読み取りやすくするための補助線です。
グリッド線を非表示にしたい場合は、次のように設定します。
C#chart1.ChartAreas[0].AxisX.MajorGrid.Enabled = false;
chart1.ChartAreas[0].AxisY.MajorGrid.Enabled = true;
グリッド線の色を薄くしたい場合は、LineColorを使います。
C#chart1.ChartAreas[0].AxisY.MajorGrid.LineColor = Color.LightGray;
グリッド線は多すぎるとグラフがごちゃつくため、必要な軸だけ表示するのがおすすめです。
6-7. グラフサイズと余白を調整する
グラフのサイズは、フォーム上でChartコントロールの大きさを変更することで調整できます。
コードでサイズを指定する場合は、Sizeを使います。
C#chart1.Size = new Size(800, 400);
フォームサイズに合わせて自動で広げたい場合は、Dockを使うと便利です。
C#chart1.Dock = DockStyle.Fill;
余白やプロット位置を細かく調整したい場合は、ChartAreaのPositionやInnerPlotPositionを使います。ただし、初心者のうちは自動調整のままでも十分です。
7. データを使ってグラフを動的に作成する方法
実際のアプリでは、固定値をコードに直接書くのではなく、配列、List、DataTable、CSV、データベースなどから読み込んだ値をグラフに表示することが多いです。
7-1. 配列のデータをグラフに表示する
配列を使うと、複数のデータをループで追加できます。
C#string[] months = { "1月", "2月", "3月", "4月", "5月" };
int[] sales = { 120, 150, 130, 180, 210 };
chart1.Series.Clear();
chart1.ChartAreas.Clear();
chart1.ChartAreas.Add(new ChartArea("MainArea"));
Series series = new Series("売上");
series.ChartType = SeriesChartType.Line;
for (int i = 0; i < months.Length; i++)
{
series.Points.AddXY(months[i], sales[i]);
}
chart1.Series.Add(series);
配列を使う場合は、X軸用の配列とY軸用の配列の要素数が一致している必要があります。
7-2. Listのデータをグラフに表示する
Listを使うと、データ数が変わる場合でも扱いやすくなります。
C#List<string> months = new List<string> { "1月", "2月", "3月", "4月" };
List<int> sales = new List<int> { 100, 140, 130, 170 };
Series series = new Series("売上");
series.ChartType = SeriesChartType.Column;
for (int i = 0; i < months.Count; i++)
{
series.Points.AddXY(months[i], sales[i]);
}
chart1.Series.Clear();
chart1.ChartAreas.Clear();
chart1.ChartAreas.Add(new ChartArea("MainArea"));
chart1.Series.Add(series);
Listは、データを後から追加したり削除したりする処理と相性がよいです。
7-3. DataTableのデータをグラフに表示する
DataTableを使うと、表形式のデータをグラフに変換しやすくなります。
C#DataTable table = new DataTable();
table.Columns.Add("Month", typeof(string));
table.Columns.Add("Sales", typeof(int));
table.Rows.Add("1月", 120);
table.Rows.Add("2月", 150);
table.Rows.Add("3月", 130);
Series series = new Series("売上");
series.ChartType = SeriesChartType.Column;
foreach (DataRow row in table.Rows)
{
string month = row["Month"].ToString();
int sales = Convert.ToInt32(row["Sales"]);
series.Points.AddXY(month, sales);
}
chart1.Series.Clear();
chart1.ChartAreas.Clear();
chart1.ChartAreas.Add(new ChartArea("MainArea"));
chart1.Series.Add(series);
DataTableは、データベースの検索結果やCSVの読み込み結果を扱うときにも便利です。
7-4. CSVファイルのデータを読み込んでグラフ化する
CSVファイルからデータを読み込み、グラフ化することもできます。
たとえば、次のようなCSVを想定します。
csvMonth,Sales
1月,120
2月,150
3月,130
4月,180
C#では、File.ReadAllLinesを使って読み込めます。
C#using System.IO;
private void LoadCsvChart()
{
string path = @"C:\data\sales.csv";
string[] lines = File.ReadAllLines(path);
chart1.Series.Clear();
chart1.ChartAreas.Clear();
chart1.ChartAreas.Add(new ChartArea("MainArea"));
Series series = new Series("売上");
series.ChartType = SeriesChartType.Line;
for (int i = 1; i < lines.Length; i++)
{
string[] values = lines[i].Split(',');
string month = values[0];
int sales = int.Parse(values[1]);
series.Points.AddXY(month, sales);
}
chart1.Series.Add(series);
}
実務では、CSVにカンマを含む文字列や空白行がある場合もあります。複雑なCSVを扱う場合は、CSV専用ライブラリを使うと安全です。
7-5. データベースの値をグラフに表示する考え方
データベースの値をグラフに表示する場合は、次の流れで考えます。
まず、SQLで必要なデータを取得します。次に、取得結果をDataTableやListに格納します。最後に、そのデータをSeriesに追加します。
たとえば、月別売上を表示したい場合は、SQL側で月ごとに集計しておくと、C#側の処理がシンプルになります。
SQLSELECT SalesMonth, SUM(Amount) AS TotalAmount
FROM Sales
GROUP BY SalesMonth
ORDER BY SalesMonth
C#側では、この結果をループしてAddXYで追加します。
7-6. ボタンクリックでグラフを更新する方法
ボタンをクリックしたタイミングでグラフを更新するには、ButtonのClickイベントにグラフ作成処理を書きます。
C#private void button1_Click(object sender, EventArgs e)
{
chart1.Series.Clear();
Series series = new Series("売上");
series.ChartType = SeriesChartType.Line;
series.Points.AddXY("1月", 120);
series.Points.AddXY("2月", 150);
series.Points.AddXY("3月", 180);
chart1.Series.Add(series);
}
更新時には、既存のSeriesをClearしてから新しいデータを追加するのが基本です。Clearしないと、同じ系列が重複したり、古いデータが残ったりすることがあります。
8. C#でよく使うグラフ種類別の設定例
Chartコントロールでは、折れ線グラフや棒グラフ以外にもさまざまなグラフを作成できます。ここでは、よく使うグラフ種類別に設定例を紹介します。
8-1. 円グラフを作成する方法
円グラフを作成するには、SeriesChartType.Pieを指定します。
C#chart1.Series.Clear();
chart1.ChartAreas.Clear();
chart1.ChartAreas.Add(new ChartArea("MainArea"));
Series series = new Series("構成比");
series.ChartType = SeriesChartType.Pie;
series.Points.AddXY("商品A", 40);
series.Points.AddXY("商品B", 30);
series.Points.AddXY("商品C", 20);
series.Points.AddXY("商品D", 10);
chart1.Series.Add(series);
chart1.Titles.Add("商品別構成比");
円グラフは、合計に対する割合を見せたい場合に使います。カテゴリが多すぎると見づらくなるため、5項目程度までに抑えると見やすくなります。
8-2. 散布図を作成する方法
散布図を作成するには、SeriesChartType.Pointを指定します。
C#chart1.Series.Clear();
chart1.ChartAreas.Clear();
ChartArea area = new ChartArea("MainArea");
area.AxisX.Title = "気温";
area.AxisY.Title = "売上";
chart1.ChartAreas.Add(area);
Series series = new Series("気温と売上");
series.ChartType = SeriesChartType.Point;
series.MarkerStyle = MarkerStyle.Circle;
series.MarkerSize = 8;
series.Points.AddXY(20, 100);
series.Points.AddXY(22, 120);
series.Points.AddXY(25, 150);
series.Points.AddXY(28, 180);
series.Points.AddXY(30, 200);
chart1.Series.Add(series);
散布図は、X軸とY軸のどちらも数値として扱いたい場合に向いています。
8-3. 面グラフを作成する方法
面グラフを作成するには、SeriesChartType.Areaを指定します。
C#Series series = new Series("売上");
series.ChartType = SeriesChartType.Area;
series.Points.AddXY("1月", 120);
series.Points.AddXY("2月", 150);
series.Points.AddXY("3月", 130);
series.Points.AddXY("4月", 180);
chart1.Series.Clear();
chart1.ChartAreas.Clear();
chart1.ChartAreas.Add(new ChartArea("MainArea"));
chart1.Series.Add(series);
面グラフは、数値の推移だけでなく、量の大きさも強調したい場合に使えます。
8-4. 積み上げ棒グラフを作成する方法
積み上げ棒グラフを作成するには、SeriesChartType.StackedColumnを指定します。
C#chart1.Series.Clear();
chart1.ChartAreas.Clear();
chart1.ChartAreas.Add(new ChartArea("MainArea"));
Series productA = new Series("商品A");
productA.ChartType = SeriesChartType.StackedColumn;
productA.Points.AddXY("1月", 50);
productA.Points.AddXY("2月", 60);
productA.Points.AddXY("3月", 70);
Series productB = new Series("商品B");
productB.ChartType = SeriesChartType.StackedColumn;
productB.Points.AddXY("1月", 40);
productB.Points.AddXY("2月", 55);
productB.Points.AddXY("3月", 65);
chart1.Series.Add(productA);
chart1.Series.Add(productB);
積み上げ棒グラフは、月ごとの合計と商品ごとの内訳を同時に見せたい場合に便利です。
8-5. 複合グラフを作成する方法
複合グラフとは、折れ線グラフと棒グラフを1つのChartに表示する方法です。
たとえば、売上を棒グラフ、利益率を折れ線グラフで表示できます。
C#chart1.Series.Clear();
chart1.ChartAreas.Clear();
ChartArea area = new ChartArea("MainArea");
area.AxisX.Title = "月";
area.AxisY.Title = "売上";
area.AxisY2.Title = "利益率";
area.AxisY2.Enabled = AxisEnabled.True;
chart1.ChartAreas.Add(area);
Series sales = new Series("売上");
sales.ChartType = SeriesChartType.Column;
sales.Points.AddXY("1月", 120);
sales.Points.AddXY("2月", 150);
sales.Points.AddXY("3月", 180);
Series rate = new Series("利益率");
rate.ChartType = SeriesChartType.Line;
rate.BorderWidth = 3;
rate.YAxisType = AxisType.Secondary;
rate.Points.AddXY("1月", 20);
rate.Points.AddXY("2月", 25);
rate.Points.AddXY("3月", 30);
chart1.Series.Add(sales);
chart1.Series.Add(rate);
単位が異なるデータを同じグラフに表示する場合は、第2軸を使うと見やすくなります。
9. C#のグラフ作成でよくあるエラーと解決方法
C#でChartコントロールを使うと、初心者がつまずきやすいポイントがあります。ここでは、よくあるエラーと解決方法を解説します。
9-1. Chartコントロールがツールボックスにない
Chartコントロールがツールボックスに表示されない場合は、プロジェクトの種類を確認してください。
Windows Formsアプリではなく、WPFアプリやコンソールアプリを作成している場合、Chartコントロールはそのままでは使えません。
また、.NET 5以降のWindows Formsでは、環境によってChartコントロールが標準表示されない場合があります。その場合は、.NET Framework版のWindows Formsで試すか、対応するパッケージや外部ライブラリの利用を検討します。
9-2. グラフにデータが表示されない
グラフにデータが表示されない場合は、次の点を確認します。
ChartAreaが追加されているか、SeriesがChartに追加されているか、Seriesにデータ点が追加されているか、ChartTypeが正しく指定されているかを確認しましょう。
特に、Seriesを作成しただけでchart1.Series.Add(series)を書き忘れるケースがよくあります。
C#chart1.Series.Add(series);
この1行がないと、作成したSeriesはChartに表示されません。
9-3. Seriesが重複してエラーになる
同じ名前のSeriesを何度も追加すると、エラーになることがあります。
たとえば、ボタンクリックのたびに次のようなコードを実行すると、「売上」というSeriesが重複する可能性があります。
C#Series series = new Series("売上");
chart1.Series.Add(series);
解決方法は、追加前にSeriesをClearすることです。
C#chart1.Series.Clear();
または、既存のSeriesがあるか確認してから追加します。
C#if (!chart1.Series.IsUniqueName("売上"))
{
chart1.Series.Remove(chart1.Series["売上"]);
}
初心者のうちは、グラフを再描画する前にClearする方法がわかりやすいです。
9-4. X軸のラベルが正しく表示されない
X軸のラベルが重なったり、表示されなかったりする場合は、ラベルの角度や間隔を調整します。
C#chart1.ChartAreas[0].AxisX.LabelStyle.Angle = -45;
chart1.ChartAreas[0].AxisX.Interval = 1;
カテゴリ名が長い場合は、横棒グラフに変更するのも有効です。
C#series.ChartType = SeriesChartType.Bar;
9-5. 値の範囲が合わずグラフが見切れる
Y軸の範囲が合わない場合は、MinimumとMaximumを設定します。
C#chart1.ChartAreas[0].AxisY.Minimum = 0;
chart1.ChartAreas[0].AxisY.Maximum = 500;
ただし、最大値を固定すると、データが増えたときに見切れることがあります。動的なデータを扱う場合は、最大値を自動にするか、データの最大値に応じて計算しましょう。
C#chart1.ChartAreas[0].AxisY.Maximum = double.NaN;
9-6. .NET Core・.NET 5以降でChartコントロールを使う際の注意点
.NET FrameworkではChartコントロールを使いやすい一方、.NET Coreや.NET 5以降では、プロジェクトの種類や環境によって扱いが異なります。
Chartコントロールが見つからない場合は、まず.NET Framework版のWindows Formsアプリで試すのが簡単です。.NET 5以降のアプリで使いたい場合は、互換パッケージや外部ライブラリを確認しましょう。
新規開発で長期的に保守する業務アプリを作る場合は、Chartコントロールだけでなく、OxyPlot、LiveCharts、ScottPlotなどの外部ライブラリも比較対象にすると安心です。
10. C#でグラフを作成するときのライブラリ選び
C#でグラフを作成する場合、必ずしもChartコントロールだけが選択肢ではありません。アプリの種類や目的に応じて、適したライブラリを選ぶことが大切です。
10-1. Chartコントロールが向いているケース
Chartコントロールが向いているのは、Windows Formsアプリでシンプルなグラフを表示したい場合です。
たとえば、社内向けの管理ツール、検査データの可視化ツール、CSVビューア、売上集計アプリ、簡易ダッシュボードなどに向いています。
折れ線グラフ、棒グラフ、円グラフなどの基本的なグラフを作るだけなら、Chartコントロールで十分対応できます。
10-2. WPFでグラフを作成したい場合の選択肢
WPFでグラフを作成したい場合は、WPFに対応した外部ライブラリを使うのが一般的です。
WPFでは、データバインディングやMVVMパターンを使うことが多いため、ChartコントロールよりもWPF向けに設計されたライブラリのほうが扱いやすいことがあります。
代表的な選択肢には、OxyPlot、LiveCharts、ScottPlotなどがあります。
10-3. OxyPlotやLiveChartsなど外部ライブラリを使うケース
外部ライブラリを使うべきケースは、次のような場合です。
デザイン性の高いグラフを作りたい、WPFでグラフを作りたい、リアルタイム更新を滑らかに見せたい、大量データを高速に描画したい、ズームやパンなどの操作を入れたい、モダンなUIに合わせたい、という場合です。
Chartコントロールは基本的なグラフには便利ですが、高度な表現やパフォーマンスが必要な場合は、専用ライブラリを検討しましょう。
10-4. 業務アプリで使う場合に確認したいポイント
業務アプリでグラフライブラリを選ぶ場合は、次のポイントを確認しましょう。
商用利用できるか、ライセンスに問題がないか、メンテナンスが続いているか、対応している.NETバージョンは何か、Windows FormsやWPFに対応しているか、大量データに耐えられるか、画像保存や印刷に対応しているか、という点です。
特に商用アプリで外部ライブラリを使う場合は、ライセンス確認が重要です。無料で使えるライブラリでも、利用条件や表記義務がある場合があります。
11. C#グラフ作成の実践サンプル
ここでは、実務でよくあるケースを想定したC#グラフ作成の実践サンプルを紹介します。
11-1. 売上データを折れ線グラフで表示する
月別売上を折れ線グラフで表示するサンプルです。
C#private void ShowSalesLineChart()
{
string[] months = { "1月", "2月", "3月", "4月", "5月", "6月" };
int[] sales = { 120, 150, 130, 180, 210, 240 };
chart1.Series.Clear();
chart1.ChartAreas.Clear();
chart1.Titles.Clear();
ChartArea area = new ChartArea("MainArea");
area.AxisX.Title = "月";
area.AxisY.Title = "売上";
chart1.ChartAreas.Add(area);
Series series = new Series("売上");
series.ChartType = SeriesChartType.Line;
series.BorderWidth = 3;
series.MarkerStyle = MarkerStyle.Circle;
for (int i = 0; i < months.Length; i++)
{
series.Points.AddXY(months[i], sales[i]);
}
chart1.Series.Add(series);
chart1.Titles.Add("売上推移");
}
このように、配列とループを使うと、コードをすっきり書けます。
11-2. 月別集計データを棒グラフで表示する
月別集計データを棒グラフで表示するサンプルです。
C#private void ShowMonthlyColumnChart()
{
Dictionary<string, int> data = new Dictionary<string, int>
{
{ "1月", 120 },
{ "2月", 150 },
{ "3月", 130 },
{ "4月", 180 }
};
chart1.Series.Clear();
chart1.ChartAreas.Clear();
chart1.ChartAreas.Add(new ChartArea("MainArea"));
Series series = new Series("売上");
series.ChartType = SeriesChartType.Column;
foreach (var item in data)
{
series.Points.AddXY(item.Key, item.Value);
}
chart1.Series.Add(series);
}
Dictionaryを使うと、カテゴリ名と数値をセットで管理できます。
11-3. センサー値をリアルタイム風に更新する
センサー値のように、一定間隔で値を追加していくグラフも作成できます。
C#private Random random = new Random();
private int time = 0;
private void timer1_Tick(object sender, EventArgs e)
{
Series series;
if (chart1.Series.Count == 0)
{
chart1.ChartAreas.Clear();
chart1.ChartAreas.Add(new ChartArea("MainArea"));
series = new Series("センサー値");
series.ChartType = SeriesChartType.Line;
series.BorderWidth = 2;
chart1.Series.Add(series);
}
else
{
series = chart1.Series["センサー値"];
}
int value = random.Next(20, 80);
series.Points.AddXY(time, value);
time++;
if (series.Points.Count > 20)
{
series.Points.RemoveAt(0);
}
chart1.ChartAreas[0].RecalculateAxesScale();
}
この例では、Timerコントロールを使って一定間隔で値を追加します。データ点が増えすぎないように、20点を超えたら古いデータを削除しています。
11-4. 複数データを1つのChartに表示する
売上と利益を1つのグラフに表示するサンプルです。
C#private void ShowSalesAndProfit()
{
chart1.Series.Clear();
chart1.ChartAreas.Clear();
ChartArea area = new ChartArea("MainArea");
area.AxisX.Title = "月";
area.AxisY.Title = "金額";
chart1.ChartAreas.Add(area);
Series sales = new Series("売上");
sales.ChartType = SeriesChartType.Line;
sales.BorderWidth = 3;
sales.Points.AddXY("1月", 120);
sales.Points.AddXY("2月", 150);
sales.Points.AddXY("3月", 180);
Series profit = new Series("利益");
profit.ChartType = SeriesChartType.Line;
profit.BorderWidth = 3;
profit.Points.AddXY("1月", 40);
profit.Points.AddXY("2月", 60);
profit.Points.AddXY("3月", 75);
chart1.Series.Add(sales);
chart1.Series.Add(profit);
}
複数データを表示する場合は、凡例を表示して各系列の意味がわかるようにしましょう。
11-5. 作成したグラフを画像として保存する
Chartコントロールで作成したグラフは、画像として保存できます。
C#private void SaveChartImage()
{
string path = @"C:\data\chart.png";
chart1.SaveImage(path, ChartImageFormat.Png);
}
PNG以外にも、JPEGやBMPなどの形式で保存できます。
C#chart1.SaveImage(@"C:\data\chart.jpg", ChartImageFormat.Jpeg);
レポート作成やメール添付、資料作成に使いたい場合は、画像保存機能が便利です。
12. C#のグラフ作成に関するよくある質問
C#でグラフを作成するときによくある質問をまとめます。
12-1. C#でグラフを作るには何を使えばいい?
初心者がWindowsデスクトップアプリでグラフを作るなら、まずWindows FormsのChartコントロールがおすすめです。
折れ線グラフ、棒グラフ、円グラフなどの基本的なグラフを簡単に作成できます。
WPFで作る場合や、デザイン性・リアルタイム性・大量データ描画が必要な場合は、OxyPlot、LiveCharts、ScottPlotなどの外部ライブラリも検討しましょう。
12-2. Chartコントロールは無料で使える?
Windows FormsのChartコントロールは、.NET Framework環境で利用できるグラフ表示機能です。Microsoftは.NET Framework 3.5向けにASP.NETおよびWindows Forms用のChart Controlsを提供しており、配布に関する条件も案内しています。
個人学習や社内ツールで使う場合は利用しやすい機能ですが、商用配布や外部配布を行う場合は、利用している環境やパッケージのライセンス条件を確認しましょう。
12-3. Windows Forms以外でもChartコントロールは使える?
Chartコントロールは主にWindows Formsで使うコントロールです。
WPFやASP.NETでグラフを作る場合は、それぞれの環境に合った方法を選ぶのが基本です。
WPFならWPF対応のグラフライブラリ、ASP.NETならJavaScriptのグラフライブラリとC#のデータ処理を組み合わせる方法がよく使われます。
12-4. 折れ線グラフと棒グラフを同時に表示できる?
はい、できます。
Chartコントロールでは、SeriesごとにChartTypeを設定できます。そのため、あるSeriesはSeriesChartType.Column、別のSeriesはSeriesChartType.Lineにすることで、棒グラフと折れ線グラフを同じChartに表示できます。
C#sales.ChartType = SeriesChartType.Column;
rate.ChartType = SeriesChartType.Line;
単位が異なる場合は、第2軸を使うと見やすくなります。
12-5. リアルタイムグラフはC#で作成できる?
はい、作成できます。
Timerを使って一定間隔でデータを追加し、古いデータを削除すれば、リアルタイム風のグラフを作成できます。
ただし、非常に短い間隔で大量データを描画する場合は、パフォーマンスに注意が必要です。大量データや高速描画が必要な場合は、リアルタイム描画に強い外部ライブラリを検討しましょう。
12-6. 初心者が最初に覚えるべきChartの設定は?
初心者が最初に覚えるべき設定は、次の5つです。
C#chart1.Series.Clear();
chart1.ChartAreas.Add(new ChartArea("MainArea"));
Series series = new Series("データ名");
series.ChartType = SeriesChartType.Line;
series.Points.AddXY("X軸の値", 100);
chart1.Series.Add(series);
この流れを理解すれば、折れ線グラフ、棒グラフ、円グラフなどに応用できます。
特に重要なのは、Seriesにデータを追加し、最後にchart1.Series.Add(series)でChartに追加することです。
まとめ
C#でグラフを作成するなら、初心者にはWindows FormsのChartコントロールがおすすめです。
Chartコントロールを使えば、折れ線グラフ、棒グラフ、円グラフ、散布図、面グラフ、積み上げ棒グラフなどを比較的簡単に作成できます。
基本的な流れは、ChartAreaを用意し、Seriesを作成し、ChartTypeを指定し、Points.AddXYでデータを追加するだけです。
折れ線グラフを作る場合はSeriesChartType.Line、縦棒グラフを作る場合はSeriesChartType.Column、横棒グラフを作る場合はSeriesChartType.Barを指定します。
また、タイトル、凡例、軸ラベル、色、線の太さ、マーカー、グリッド線を調整すると、見やすく実用的なグラフになります。
実務では、配列、List、DataTable、CSV、データベースなどから取得したデータをグラフに表示することが多くなります。固定値のサンプルで基本を理解したら、次は外部データを読み込んで動的にグラフを作成してみましょう。
Windows FormsのChartコントロールは、C#でグラフ作成を学ぶ最初のステップとして非常に扱いやすい方法です。まずは折れ線グラフと棒グラフの作成から始め、必要に応じて円グラフ、散布図、複合グラフ、リアルタイム更新などに発展させていくとよいでしょう。

