C#

C# ポイントグラフを表示する(Chartコントロール)

MSDNでは、ポイントグラフの説明として「データを表すときに値のポイントを使用します」となっています。
これは、「散布図」のことになります。

線グラフや棒グラフと異なり、データの2つのデータの組合せをXYとしてそのままグラフに表示するというもので、データの散布・収束を見るために使用します。

 

サンプルコード

基本のサンプルは下記のようになります。

private void frmMain_Load(object sender, EventArgs e)
{
    // フォームをロードするときの処理
    chart1.Series.Clear();  // ← 最初からSeriesが1つあるのでクリアします
    chart1.ChartAreas.Clear();

    // ChartにChartAreaを追加します
    string chart_area1 = "Area1";
    chart1.ChartAreas.Add(new ChartArea(chart_area1));
    // ChartにSeriesを追加します
    string legend1 = "Graph1";
    chart1.Series.Add(legend1);
    // グラフの種別を指定
    chart1.Series[legend1].ChartType = SeriesChartType.Point; // ポイントグラフを指定

    // データを用意します
    double[] x_values = new double[5] { 1.0, 0.8, 1.8, 0.2, 1.2 };
    double[] y_values = new double[5] { 1.0, 1.2, 0.8, 1.8, 0.2 };

    // データをシリーズにセットします
    for (int i = 0; i < y_values.Length; i++)
    {
        DataPoint dp = new DataPoint((double)x_values[i], y_values[i]);
        chart1.Series[legend1].Points.Add(dp);
    }

}

 

このコードをビルド、実行すると下図のように表示されます。

 

上記のようにデータを位置として点で表示して終わりじゃないの?と思われるかもしれません。
このポイントグラフに限らずChartコントロールでは、この「点」もカスタマイズできます。

 

点のサイズ(Chart.Series.MarkerSizeプロパティ)

Chart.Series.MarkerSizeプロパティを変えると、点の「サイズ」を変えることができます。
デフォルトのMarkerSizeは’5’です。

MarkerSizeの値は、0や1だと正直なところ見えません。
MarkerSize=2であれば、かろうじて見える(ちゃんと表示されている)ことが確認できます。

 

 

キャプチャ画像で解像度などの関係でわかりづらいかと思いますので、一部拡大した画像も載せておきます。

 

MarkSize=10にすると、このくらいの大きさです。

 

追加は下記の箇所で行いました。

    // グラフの種別を指定
    chart1.Series[legend1].ChartType = SeriesChartType.Point; // ポイントグラフを指定
    chart1.Series[legend1].MarkerSize = 10;                   // マークサイズを指定

 

点の形(Chart.Series.MarkerStyleプロパティ)

Chart.Series.MarkerStyleプロパティを変えると、点の「形状」を変えることができます。

マークサイズを’20′(見やすさのため)にして、下記の箇所に追加しました。

    // グラフの種別を指定
    chart1.Series[legend1].ChartType = SeriesChartType.Point; // ポイントグラフを指定
    chart1.Series[legend1].MarkerSize = 20;                   // マークサイズを指定
    chart1.Series[legend1].MarkerStyle = MarkerStyle.None; // マークスタイル(形状)を指定

 

Chart.Series.MarkerStyleプロパティに指定できるMarkerStyleの値は、下記の10種類です。

名称
0 None マーカーは表示されません
1 Square 正方形のマーカー
2 Circle 円形のマーカー
3 Diamond 菱形のマーカー
4 Triangle 三角形のマーカー
5 Cross 十字形のマーカー
6 Star4 頂点が 4 個の星形のマーカー
7 Star5 頂点が 5 個の星形のマーカー
8 Star6 頂点が 6 個の星形のマーカー
9 Star10 頂点が 10 個の星形のマーカー

 

0. None マーカーは表示されません

(正方形で表示されました)

 

1. Square 正方形のマーカー

 

2. Circle 円形のマーカー

 

3. Diamond 菱形のマーカー

 

4. Triangle 三角形のマーカー

 

5. Cross 十字形のマーカー

 

6. Star4 頂点が 4 個の星形のマーカー

 

7. Star5 頂点が 5 個の星形のマーカー

 

8. Star6 頂点が 6 個の星形のマーカー

 

9. Star10 頂点が 10 個の星形のマーカー

 

 

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