C# バブルチャートを表示する(Chartコントロール)

バブル チャートは、ポイントグラフのバリエーションの 1 つです。データ ポイントはさまざまなサイズのバブルで置き換えられます。

ポイントグラフとの違い

バブルチャートが、ポイントグラフと違うところは「点の大きさをデータとして持っている」というところにあります。
これは、3次元グラフなどにあるZ軸のようなものです。

Chartコントロールでの表現方法

点の大きさ(Z軸)を表すためには、XYを持つ1点のデータにさらにデータを追加しなければいけません。
Chartコントロールでの「点1つのデータ」はDataPointクラスが持っています。
DataPointクラスのコンストラクタはオーバーロードがあり

1. XとYを1つずつ引数に取るコンストラクタ

public DataPoint(double xValue, double yValue);

2. Xと「Yの配列」を引数に取るコンストラクタ

public DataPoint(double xValue, double[] yValues);

があり、バブルチャートではこの”2.”のほうのコンストラクタを使用します。

引数のイメージは

となります。

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

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.Bubble;  // ポイントグラフを指定
    //chart1.Series[legend1].MarkerSize = 20;                     // マークサイズを指定
    chart1.Series[legend1].MarkerStyle = MarkerStyle.Circle;    // マークスタイル(形状)を指定


    // データを用意します
    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 };
    double[] bubble_values = new double[5] { 10.0, 1.2, 80.8, 15.8, 5.2 };  // バブルチャートのZ軸(ポイントの大きさを決めるデータ)

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

}

このコードを実行すると、下図のようなグラフが表示されます。

基本的なバブルチャートでは、MarkStyle.Circleですが、ポイントグラフで紹介したようにSeriesのMarkStyleプロパティを設定するとそれぞれの形でバブルチャートを表示することもできます。