FlexChart for WinForms
WinForms 点グラフ
WinForms のチャートタイプ > WinForms 点グラフ

WinForms 散布図

散布図は、2 つの変数間の関係を特定するために数値データペアをプロットすることができる強力なチャートタイプです。散布図は、一方の変数がもう一方の変数からどの程度影響を受けるかを示します。大量のデータポイントの比較に最適です。たとえば、次のチャートは、ある会社の従業員の体重と身長の関係を表示したものです。

WinForms 散布図

Winforms 散布図の作成

これらのチャートは、FlexChart クラスにある ChartType プロパティを Scatter に設定することによって作成できます。このプロパティは、C1.Chart 名前空間の ChartType 列挙に含まれる値を受け取ります。 デフォルトで FlexChart は、丸記号と標準サイズおよびスタイルを使用して散布図をレンダリングします。 ただし、これは系列の SymbolMarker、SymbolSize、および SymbolStyle プロパティを設定することで変更できます。 散布図を回転させるには(X 軸を縦軸、Y 軸を横軸にレンダリングするには)、Rotated プロパティを true に設定します。

FlexChart を使用して散布図を作成するには

設計時

  1. フォームで FlexChart コントロールを右クリックして[プロパティ]ウィンドウを開きます。
  2. ChartType プロパティに移動して、その値を Scatter に設定します。
  3. DataSource プロパティを使用してデータソースを設定します。
  4. BindingX および Binding プロパティを設定して、X 軸と Y 軸の値をそれぞれ構成します。

コードの使用

WinForms 散布図をコードで作成するには、コントロールを初期化した後に、最初にデフォルトの系列をクリアし、Add メソッドを使用して新しい系列を追加します。DataSource プロパティを使用してデータソースを設定し、BindingX および Binding プロパティを設定して X 軸と Y 軸を構成します。また、ChartType などの必要なプロパティを使用して、チャートを設定する必要があります。

this.flexChart1.Series.Clear();

// データを集めます
var data = GetPointData().Take(200);
// SI単位値をImperialUnit値に変換します
data = data.Select(x => new PointD { X = x.X * 0.0328084, Y = x.Y * 2.20462 }).ToList();

// チャートタイプを散布図に設定します
this.flexChart1.ChartType = ChartType.Scatter;

// データをFlexChartに渡します
this.flexChart1.DataSource = data;

// チャートのX軸を「X」にバインドして、X座標が横軸に表示されるようにします
this.flexChart1.BindingX = "X";

// FlexChartのY座標に対して系列を作成します 
var strength = new Series { Binding = "Y" };
this.flexChart1.Series.Add(strength);

// チャートのヘッダーを設定します
this.flexChart1.Header.Content = "ACME Corporation : Employee BMI Analysis";
Me.flexChart1.Series.Clear()

' データを集めます
Dim data As IEnumerable(Of PointD) = GetPointData().Take(200)
' SI単位値をImperialUnit値に変換します
data = data.[Select](Function(x) New PointD() With {
     .X = x.X * 0.0328084,
     .Y = x.Y * 2.20462
}).ToList()

' チャートタイプを散布図に設定します
Me.flexChart1.ChartType = ChartType.Scatter

' データをFlexChartに渡します
Me.flexChart1.DataSource = data

' チャートのX軸を「X」にバインドして、X座標が横軸に表示されるようにします
Me.flexChart1.BindingX = "X"

' FlexChartのY座標に対して系列を作成します 
Dim strength As Series = New Series() With {
     .Binding = "Y"
}
Me.flexChart1.Series.Add(strength)

' チャートのヘッダーを設定します
Me.flexChart1.Header.Content = "ACME Corporation : Employee BMI Analysis"

上記のサンプルコードは、GetPointData という名前のカスタムメソッドを使用してデータを提供しています。要件に基づいてデータソースを設定できます。

/// <summary>
/// FlexChartのデータを作成するメソッド
/// </summary>
public static List<PointD> GetPointData()
{
    var original = new List<PointD>() { new PointD{X=161.2,Y= 51.6}, new PointD{X=167.5,Y= 59.0}, new PointD{X=159.5,Y= 49.2}, new PointD{X=157.0,Y= 63.0}, new PointD{X=155.8,Y= 53.6},
    new PointD{X=170.0,Y= 59.0}, new PointD{X=159.1,Y= 47.6}, new PointD{X=166.0,Y= 69.8}, new PointD{X=176.2,Y= 66.8}, new PointD{X=160.2,Y= 75.2},
    new PointD{X=172.5,Y= 55.2}, new PointD{X=170.9,Y= 54.2}, new PointD{X=172.9,Y= 62.5}, new PointD{X=153.4,Y= 42.0}, new PointD{X=160.0,Y= 50.0},
    new PointD{X=147.2,Y= 49.8}, new PointD{X=168.2,Y= 49.2}, new PointD{X=175.0,Y= 73.2}, new PointD{X=157.0,Y= 47.8}, new PointD{X=167.6,Y= 68.8},
    new PointD{X=159.5,Y= 50.6}, new PointD{X=175.0,Y= 82.5}, new PointD{X=166.8,Y= 57.2}, new PointD{X=176.5,Y= 87.8}, new PointD{X=170.2,Y= 72.8},
    new PointD{X=174.0,Y= 54.5}, new PointD{X=173.0,Y= 59.8}, new PointD{X=179.9,Y= 67.3}, new PointD{X=170.5,Y= 67.8}, new PointD{X=160.0,Y= 47.0},
    new PointD{X=154.4,Y= 46.2}, new PointD{X=162.0,Y= 55.0}, new PointD{X=176.5,Y= 83.0}, new PointD{X=160.0,Y= 54.4}, new PointD{X=152.0,Y= 45.8},
    new PointD{X=162.1,Y= 53.6}, new PointD{X=170.0,Y= 73.2}, new PointD{X=160.2,Y= 52.1}, new PointD{X=161.3,Y= 67.9}, new PointD{X=166.4,Y= 56.6},
    new PointD{X=168.9,Y= 62.3}, new PointD{X=163.8,Y= 58.5}, new PointD{X=167.6,Y= 54.5}, new PointD{X=160.0,Y= 50.2}, new PointD{X=161.3,Y= 60.3},
    new PointD{X=167.6,Y= 58.3}, new PointD{X=165.1,Y= 56.2}, new PointD{X=160.0,Y= 50.2}, new PointD{X=170.0,Y= 72.9}, new PointD{X=157.5,Y= 59.8},
    new PointD{X=167.6,Y= 61.0}, new PointD{X=160.7,Y= 69.1}, new PointD{X=163.2,Y= 55.9}, new PointD{X=152.4,Y= 46.5}, new PointD{X=157.5,Y= 54.3},
    new PointD{X=168.3,Y= 54.8}, new PointD{X=180.3,Y= 60.7}, new PointD{X=165.5,Y= 60.0}, new PointD{X=165.0,Y= 62.0}, new PointD{X=164.5,Y= 60.3},
    new PointD{X=156.0,Y= 52.7}, new PointD{X=160.0,Y= 74.3}, new PointD{X=163.0,Y= 62.0}, new PointD{X=165.7,Y= 73.1}, new PointD{X=161.0,Y= 80.0},
    new PointD{X=162.0,Y= 54.7}, new PointD{X=166.0,Y= 53.2}, new PointD{X=174.0,Y= 75.7}, new PointD{X=172.7,Y= 61.1}, new PointD{X=167.6,Y= 55.7},
    new PointD{X=151.1,Y= 48.7}, new PointD{X=164.5,Y= 52.3}, new PointD{X=163.5,Y= 50.0}, new PointD{X=152.0,Y= 59.3}, new PointD{X=169.0,Y= 62.5},
    new PointD{X=164.0,Y= 55.7}, new PointD{X=161.2,Y= 54.8}, new PointD{X=155.0,Y= 45.9}, new PointD{X=170.0,Y= 70.6}, new PointD{X=176.2,Y= 67.2},
    new PointD{X=170.0,Y= 69.4}, new PointD{X=162.5,Y= 58.2}, new PointD{X=170.3,Y= 64.8}, new PointD{X=164.1,Y= 71.6}, new PointD{X=169.5,Y= 52.8},
    new PointD{X=163.2,Y= 59.8}, new PointD{X=154.5,Y= 49.0}, new PointD{X=159.8,Y= 50.0}, new PointD{X=173.2,Y= 69.2}, new PointD{X=170.0,Y= 55.9},
    new PointD{X=161.4,Y= 63.4}, new PointD{X=169.0,Y= 58.2}, new PointD{X=166.2,Y= 58.6}, new PointD{X=159.4,Y= 45.7}, new PointD{X=162.5,Y= 52.2},
    new PointD{X=159.0,Y= 48.6}, new PointD{X=162.8,Y= 57.8}, new PointD{X=159.0,Y= 55.6}, new PointD{X=179.8,Y= 66.8}, new PointD{X=162.9,Y= 59.4},
    new PointD{X=161.0,Y= 53.6}, new PointD{X=151.1,Y= 73.2}, new PointD{X=168.2,Y= 53.4}, new PointD{X=168.9,Y= 69.0}, new PointD{X=173.2,Y= 58.4},
    new PointD{X=171.8,Y= 56.2}, new PointD{X=178.0,Y= 70.6}, new PointD{X=164.3,Y= 59.8}, new PointD{X=163.0,Y= 72.0}, new PointD{X=168.5,Y= 65.2},
    new PointD{X=166.8,Y= 56.6}, new PointD{X=172.7,Y= 105.2}, new PointD{X=163.5,Y= 51.8}, new PointD{X=169.4,Y= 63.4}, new PointD{X=167.8,Y= 59.0},
    new PointD{X=159.5,Y= 47.6}, new PointD{X=167.6,Y= 63.0}, new PointD{X=161.2,Y= 55.2}, new PointD{X=160.0,Y= 45.0}, new PointD{X=163.2,Y= 54.0},
    new PointD{X=162.2,Y= 50.2}, new PointD{X=161.3,Y= 60.2}, new PointD{X=149.5,Y= 44.8}, new PointD{X=157.5,Y= 58.8}, new PointD{X=163.2,Y= 56.4},
    new PointD{X=172.7,Y= 62.0}, new PointD{X=155.0,Y= 49.2}, new PointD{X=156.5,Y= 67.2}, new PointD{X=164.0,Y= 53.8}, new PointD{X=160.9,Y= 54.4},
    new PointD{X=162.8,Y= 58.0}, new PointD{X=167.0,Y= 59.8}, new PointD{X=160.0,Y= 54.8}, new PointD{X=160.0,Y= 43.2}, new PointD{X=168.9,Y= 60.5},
    new PointD{X=158.2,Y= 46.4}, new PointD{X=156.0,Y= 64.4}, new PointD{X=160.0,Y= 48.8}, new PointD{X=167.1,Y= 62.2}, new PointD{X=158.0,Y= 55.5},
    new PointD{X=167.6,Y= 57.8}, new PointD{X=156.0,Y= 54.6}, new PointD{X=162.1,Y= 59.2}, new PointD{X=173.4,Y= 52.7}, new PointD{X=159.8,Y= 53.2},
    new PointD{X=170.5,Y= 64.5}, new PointD{X=159.2,Y= 51.8}, new PointD{X=157.5,Y= 56.0}, new PointD{X=161.3,Y= 63.6}, new PointD{X=162.6,Y= 63.2},
    new PointD{X=160.0,Y= 59.5}, new PointD{X=168.9,Y= 56.8}, new PointD{X=165.1,Y= 64.1}, new PointD{X=162.6,Y= 50.0}, new PointD{X=165.1,Y= 72.3},
    new PointD{X=166.4,Y= 55.0}, new PointD{X=160.0,Y= 55.9}, new PointD{X=152.4,Y= 60.4}, new PointD{X=170.2,Y= 69.1}, new PointD{X=162.6,Y= 84.5},
    new PointD{X=170.2,Y= 55.9}, new PointD{X=158.8,Y= 55.5}, new PointD{X=172.7,Y= 69.5}, new PointD{X=167.6,Y= 76.4}, new PointD{X=162.6,Y= 61.4},
    new PointD{X=167.6,Y= 65.9}, new PointD{X=156.2,Y= 58.6}, new PointD{X=175.2,Y= 66.8}, new PointD{X=172.1,Y= 56.6}, new PointD{X=162.6,Y= 58.6},
    new PointD{X=160.0,Y= 55.9}, new PointD{X=165.1,Y= 59.1}, new PointD{X=182.9,Y= 81.8}, new PointD{X=166.4,Y= 70.7}, new PointD{X=165.1,Y= 56.8},
    new PointD{X=177.8,Y= 60.0}, new PointD{X=165.1,Y= 58.2}, new PointD{X=175.3,Y= 72.7}, new PointD{X=154.9,Y= 54.1}, new PointD{X=158.8,Y= 49.1},
    new PointD{X=172.7,Y= 75.9}, new PointD{X=168.9,Y= 55.0}, new PointD{X=161.3,Y= 57.3}, new PointD{X=167.6,Y= 55.0}, new PointD{X=165.1,Y= 65.5},
    new PointD{X=175.3,Y= 65.5}, new PointD{X=157.5,Y= 48.6}, new PointD{X=163.8,Y= 58.6}, new PointD{X=167.6,Y= 63.6}, new PointD{X=165.1,Y= 55.2},
    new PointD{X=165.1,Y= 62.7}, new PointD{X=168.9,Y= 56.6}, new PointD{X=162.6,Y= 53.9}, new PointD{X=164.5,Y= 63.2}, new PointD{X=176.5,Y= 73.6},
    new PointD{X=168.9,Y= 62.0}, new PointD{X=175.3,Y= 63.6}, new PointD{X=159.4,Y= 53.2}, new PointD{X=160.0,Y= 53.4}, new PointD{X=170.2,Y= 55.0},
    new PointD{X=162.6,Y= 70.5}, new PointD{X=167.6,Y= 54.5}, new PointD{X=162.6,Y= 54.5}, new PointD{X=160.7,Y= 55.9}, new PointD{X=160.0,Y= 59.0},
    new PointD{X=157.5,Y= 63.6}, new PointD{X=162.6,Y= 54.5}, new PointD{X=152.4,Y= 47.3}, new PointD{X=170.2,Y= 67.7}, new PointD{X=165.1,Y= 80.9},
    new PointD{X=172.7,Y= 70.5}, new PointD{X=165.1,Y= 60.9}, new PointD{X=170.2,Y= 63.6}, new PointD{X=170.2,Y= 54.5}, new PointD{X=170.2,Y= 59.1},
    new PointD{X=161.3,Y= 70.5}, new PointD{X=167.6,Y= 52.7}, new PointD{X=167.6,Y= 62.7}, new PointD{X=165.1,Y= 86.3}, new PointD{X=162.6,Y= 66.4},
    new PointD{X=152.4,Y= 67.3}, new PointD{X=168.9,Y= 63.0}, new PointD{X=170.2,Y= 73.6}, new PointD{X=175.2,Y= 62.3}, new PointD{X=175.2,Y= 57.7},
    new PointD{X=160.0,Y= 55.4}, new PointD{X=165.1,Y= 104.1}, new PointD{X=174.0,Y= 55.5}, new PointD{X=170.2,Y= 77.3}, new PointD{X=160.0,Y= 80.5},
    new PointD{X=167.6,Y= 64.5}, new PointD{X=167.6,Y= 72.3}, new PointD{X=167.6,Y= 61.4}, new PointD{X=154.9,Y= 58.2}, new PointD{X=162.6,Y= 81.8},
    new PointD{X=175.3,Y= 63.6}, new PointD{X=171.4,Y= 53.4}, new PointD{X=157.5,Y= 54.5}, new PointD{X=165.1,Y= 53.6}, new PointD{X=160.0,Y= 60.0},
    new PointD{X=174.0,Y= 73.6}, new PointD{X=162.6,Y= 61.4}, new PointD{X=174.0,Y= 55.5}, new PointD{X=162.6,Y= 63.6}, new PointD{X=161.3,Y= 60.9},
    new PointD{X=156.2,Y= 60.0}, new PointD{X=149.9,Y= 46.8}, new PointD{X=169.5,Y= 57.3}, new PointD{X=160.0,Y= 64.1}, new PointD{X=175.3,Y= 63.6},
    new PointD{X=169.5,Y= 67.3}, new PointD{X=160.0,Y= 75.5}, new PointD{X=172.7,Y= 68.2}, new PointD{X=162.6,Y= 61.4}, new PointD{X=157.5,Y= 76.8},
    new PointD{X=176.5,Y= 71.8}, new PointD{X=164.4,Y= 55.5}, new PointD{X=160.7,Y= 48.6}, new PointD{X=174.0,Y= 66.4}, new PointD{X=163.8,Y= 67.3}};
    return original;
}
''' <summary>
''' FlexChartのデータを作成するメソッド
''' </summary>
Public Shared Function GetPointData() As List(Of PointD)
    Dim original As List(Of PointD) = New List(Of PointD)() From {
        New PointD() With {.X = 161.2,.Y = 51.6}, New PointD() With {.X = 167.5,.Y = 59.0}, New PointD() With {.X = 159.5,.Y = 49.2}, 
        New PointD() With {.X = 157.0,.Y = 63.0}, New PointD() With {.X = 155.8,.Y = 53.6}, New PointD() With {.X = 170.0,.Y = 59.0}, 
        New PointD() With {.X = 159.1,.Y = 47.6}, New PointD() With {.X = 166.0,.Y = 69.8}, New PointD() With {.X = 176.2,.Y = 66.8}, 
        New PointD() With {.X = 160.2,.Y = 75.2}, New PointD() With {.X = 172.5,.Y = 55.2}, New PointD() With {.X = 170.9,.Y = 54.2}, 
        New PointD() With {.X = 172.9,.Y = 62.5}, New PointD() With {.X = 153.4,.Y = 42.0}, New PointD() With {.X = 160.0,.Y = 50.0}, 
        New PointD() With {.X = 147.2,.Y = 49.8}, New PointD() With {.X = 168.2,.Y = 49.2}, New PointD() With {.X = 175.0,.Y = 73.2}, 
        New PointD() With {.X = 157.0,.Y = 47.8}, New PointD() With {.X = 167.6,.Y = 68.8}, New PointD() With {.X = 159.5,.Y = 50.6}, 
        New PointD() With {.X = 175.0,.Y = 82.5}, New PointD() With {.X = 166.8,.Y = 57.2}, New PointD() With {.X = 176.5,.Y = 87.8}, 
        New PointD() With {.X = 170.2,.Y = 72.8}, New PointD() With {.X = 174.0,.Y = 54.5}, New PointD() With {.X = 173.0,.Y = 59.8}, 
        New PointD() With {.X = 179.9,.Y = 67.3}, New PointD() With {.X = 170.5,.Y = 67.8}, New PointD() With {.X = 160.0,.Y = 47.0}, 
        New PointD() With {.X = 154.4,.Y = 46.2}, New PointD() With {.X = 162.0,.Y = 55.0}, New PointD() With {.X = 176.5,.Y = 83.0}, 
        New PointD() With {.X = 160.0,.Y = 54.4}, New PointD() With {.X = 152.0,.Y = 45.8}, New PointD() With {.X = 162.1,.Y = 53.6}, 
        New PointD() With {.X = 170.0,.Y = 73.2}, New PointD() With {.X = 160.2,.Y = 52.1}, New PointD() With {.X = 161.3,.Y = 67.9}, 
        New PointD() With {.X = 166.4,.Y = 56.6}, New PointD() With {.X = 168.9,.Y = 62.3}, New PointD() With {.X = 163.8,.Y = 58.5}, 
        New PointD() With {.X = 167.6,.Y = 54.5}, New PointD() With {.X = 160.0,.Y = 50.2}, New PointD() With {.X = 161.3,.Y = 60.3}, 
        New PointD() With {.X = 167.6,.Y = 58.3}, New PointD() With {.X = 165.1,.Y = 56.2}, New PointD() With {.X = 160.0,.Y = 50.2}, 
        New PointD() With {.X = 170.0,.Y = 72.9}, New PointD() With {.X = 157.5,.Y = 59.8}, New PointD() With {.X = 167.6,.Y = 61.0}, 
        New PointD() With {.X = 160.7,.Y = 69.1}, New PointD() With {.X = 163.2,.Y = 55.9}, New PointD() With {.X = 152.4,.Y = 46.5}, 
        New PointD() With {.X = 157.5,.Y = 54.3}, New PointD() With {.X = 168.3,.Y = 54.8}, New PointD() With {.X = 180.3,.Y = 60.7}, 
        New PointD() With {.X = 165.5,.Y = 60.0}, New PointD() With {.X = 165.0,.Y = 62.0}, New PointD() With {.X = 164.5,.Y = 60.3}, 
        New PointD() With {.X = 156.0,.Y = 52.7}, New PointD() With {.X = 160.0,.Y = 74.3}, New PointD() With {.X = 163.0,.Y = 62.0}, 
        New PointD() With {.X = 165.7,.Y = 73.1}, New PointD() With {.X = 161.0,.Y = 80.0}, New PointD() With {.X = 162.0,.Y = 54.7}, 
        New PointD() With {.X = 166.0,.Y = 53.2}, New PointD() With {.X = 174.0,.Y = 75.7}, New PointD() With {.X = 172.7,.Y = 61.1}, 
        New PointD() With {.X = 167.6,.Y = 55.7}, New PointD() With {.X = 151.1,.Y = 48.7}, New PointD() With {.X = 164.5,.Y = 52.3}, 
        New PointD() With {.X = 163.5,.Y = 50.0}, New PointD() With {.X = 152.0,.Y = 59.3}, New PointD() With {.X = 169.0,.Y = 62.5}, 
        New PointD() With {.X = 164.0,.Y = 55.7}, New PointD() With {.X = 161.2,.Y = 54.8}, New PointD() With {.X = 155.0,.Y = 45.9}, 
        New PointD() With {.X = 170.0,.Y = 70.6}, New PointD() With {.X = 176.2,.Y = 67.2}, New PointD() With {.X = 170.0,.Y = 69.4},
        New PointD() With {.X = 169.5,.Y = 52.8}, New PointD() With {.X = 163.2,.Y = 59.8}, New PointD() With {.X = 154.5,.Y = 49.0}, 
        New PointD() With {.X = 159.8,.Y = 50.0}, New PointD() With {.X = 173.2,.Y = 69.2}, New PointD() With {.X = 170.0,.Y = 55.9}, 
        New PointD() With {.X = 161.4,.Y = 63.4}, New PointD() With {.X = 169.0,.Y = 58.2}, New PointD() With {.X = 166.2,.Y = 58.6}, 
        New PointD() With {.X = 159.4,.Y = 45.7}, New PointD() With {.X = 162.5,.Y = 52.2}, New PointD() With {.X = 159.0,.Y = 48.6}, 
        New PointD() With {.X = 162.8,.Y = 57.8}, New PointD() With {.X = 159.0,.Y = 55.6}, New PointD() With {.X = 179.8,.Y = 66.8}, 
        New PointD() With {.X = 162.9,.Y = 59.4}, New PointD() With {.X = 161.0,.Y = 53.6}, New PointD() With {.X = 151.1,.Y = 73.2}, 
        New PointD() With {.X = 168.2,.Y = 53.4}, New PointD() With {.X = 168.9,.Y = 69.0}, New PointD() With {.X = 173.2,.Y = 58.4},
        New PointD() With {.X = 163.0,.Y = 72.0}, New PointD() With {.X = 168.5,.Y = 65.2}, New PointD() With {.X = 166.8,.Y = 56.6}, 
        New PointD() With {.X = 172.7,.Y = 105.2}, New PointD() With {.X = 163.5,.Y = 51.8}, New PointD() With {.X = 169.4,.Y = 63.4}, 
        New PointD() With {.X = 167.8,.Y = 59.0}, New PointD() With {.X = 159.5,.Y = 47.6}, New PointD() With {.X = 167.6,.Y = 63.0}, 
        New PointD() With {.X = 161.2,.Y = 55.2}, New PointD() With {.X = 160.0,.Y = 45.0}, New PointD() With {.X = 163.2,.Y = 54.0}, 
        New PointD() With {.X = 162.2,.Y = 50.2}, New PointD() With {.X = 161.3,.Y = 60.2}, New PointD() With {.X = 149.5,.Y = 44.8}, 
        New PointD() With {.X = 157.5,.Y = 58.8}, New PointD() With {.X = 163.2,.Y = 56.4}, New PointD() With {.X = 172.7,.Y = 62.0}, 
        New PointD() With {.X = 155.0,.Y = 49.2}, New PointD() With {.X = 156.5,.Y = 67.2}, New PointD() With {.X = 164.0,.Y = 53.8}, 
        New PointD() With {.X = 160.9,.Y = 54.4}, New PointD() With {.X = 162.8,.Y = 58.0}, New PointD() With {.X = 167.0,.Y = 59.8}, 
        New PointD() With {.X = 160.0,.Y = 54.8}, New PointD() With {.X = 160.0,.Y = 43.2}, New PointD() With {.X = 168.9,.Y = 60.5}, 
        New PointD() With {.X = 158.2,.Y = 46.4}, New PointD() With {.X = 156.0,.Y = 64.4}, New PointD() With {.X = 160.0,.Y = 48.8}, 
        New PointD() With {.X = 167.1,.Y = 62.2}, New PointD() With {.X = 158.0,.Y = 55.5}, New PointD() With {.X = 167.6,.Y = 57.8}, 
        New PointD() With {.X = 156.0,.Y = 54.6}, New PointD() With {.X = 162.1,.Y = 59.2}, New PointD() With {.X = 173.4,.Y = 52.7}, 
        New PointD() With {.X = 159.8,.Y = 53.2}, New PointD() With {.X = 170.5,.Y = 64.5}, New PointD() With {.X = 159.2,.Y = 51.8}, 
        New PointD() With {.X = 157.5,.Y = 56.0}, New PointD() With {.X = 161.3,.Y = 63.6}, New PointD() With {.X = 162.6,.Y = 63.2}, 
        New PointD() With {.X = 160.0,.Y = 59.5}, New PointD() With {.X = 168.9,.Y = 56.8}, New PointD() With {.X = 165.1,.Y = 64.1}, 
        New PointD() With {.X = 162.6,.Y = 50.0}, New PointD() With {.X = 165.1,.Y = 72.3}, New PointD() With {.X = 166.4,.Y = 55.0}, 
        New PointD() With {.X = 160.0,.Y = 55.9}, New PointD() With {.X = 152.4,.Y = 60.4}, New PointD() With {.X = 170.2,.Y = 69.1}, 
        New PointD() With {.X = 162.6,.Y = 84.5}, New PointD() With {.X = 170.2,.Y = 55.9}, New PointD() With {.X = 158.8,.Y = 55.5}, 
        New PointD() With {.X = 172.7,.Y = 69.5}, New PointD() With {.X = 167.6,.Y = 76.4}, New PointD() With {.X = 162.6,.Y = 61.4}, 
        New PointD() With {.X = 167.6,.Y = 65.9}, New PointD() With {.X = 156.2,.Y = 58.6}, New PointD() With {.X = 175.2,.Y = 66.8}, 
        New PointD() With {.X = 172.1,.Y = 56.6}, New PointD() With {.X = 162.6,.Y = 58.6}, New PointD() With {.X = 160.0,.Y = 55.9}, 
        New PointD() With {.X = 165.1,.Y = 59.1}, New PointD() With {.X = 182.9,.Y = 81.8}, New PointD() With {.X = 166.4,.Y = 70.7}, 
        New PointD() With {.X = 165.1,.Y = 56.8}, New PointD() With {.X = 177.8,.Y = 60.0}, New PointD() With {.X = 165.1,.Y = 58.2}, 
        New PointD() With {.X = 175.3,.Y = 72.7}, New PointD() With {.X = 154.9,.Y = 54.1}, New PointD() With {.X = 158.8,.Y = 49.1}, 
        New PointD() With {.X = 172.7,.Y = 75.9}, New PointD() With {.X = 168.9,.Y = 55.0}, New PointD() With {.X = 161.3,.Y = 57.3}, 
        New PointD() With {.X = 167.6,.Y = 55.0}, New PointD() With {.X = 165.1,.Y = 65.5}, New PointD() With {.X = 175.3,.Y = 65.5}, 
        New PointD() With {.X = 157.5,.Y = 48.6}, New PointD() With {.X = 163.8,.Y = 58.6}, New PointD() With {.X = 167.6,.Y = 63.6}, 
        New PointD() With {.X = 165.1,.Y = 55.2}, New PointD() With {.X = 165.1,.Y = 62.7}, New PointD() With {.X = 168.9,.Y = 56.6}, 
        New PointD() With {.X = 162.6,.Y = 53.9}, New PointD() With {.X = 164.5,.Y = 63.2}, New PointD() With {.X = 176.5,.Y = 73.6}, 
        New PointD() With {.X = 168.9,.Y = 62.0}, New PointD() With {.X = 175.3,.Y = 63.6}, New PointD() With {.X = 159.4,.Y = 53.2}, 
        New PointD() With {.X = 160.0,.Y = 53.4}, New PointD() With {.X = 170.2,.Y = 55.0}, New PointD() With {.X = 162.6,.Y = 70.5}, 
        New PointD() With {.X = 167.6,.Y = 54.5}, New PointD() With {.X = 162.6,.Y = 54.5}, New PointD() With {.X = 160.7,.Y = 55.9}, 
        New PointD() With {.X = 160.0,.Y = 59.0}, New PointD() With {.X = 157.5,.Y = 63.6}, New PointD() With {.X = 162.6,.Y = 54.5}, 
        New PointD() With {.X = 152.4,.Y = 47.3}, New PointD() With {.X = 170.2,.Y = 67.7}, New PointD() With {.X = 165.1,.Y = 80.9}, 
        New PointD() With {.X = 172.7,.Y = 70.5}, New PointD() With {.X = 165.1,.Y = 60.9}, New PointD() With {.X = 170.2,.Y = 63.6}, 
        New PointD() With {.X = 170.2,.Y = 54.5}, New PointD() With {.X = 170.2,.Y = 59.1}, New PointD() With {.X = 161.3,.Y = 70.5}, 
        New PointD() With {.X = 167.6,.Y = 52.7}, New PointD() With {.X = 167.6,.Y = 62.7}, New PointD() With {.X = 165.1,.Y = 86.3}, 
        New PointD() With {.X = 162.6,.Y = 66.4}, New PointD() With {.X = 152.4,.Y = 67.3}, New PointD() With {.X = 168.9,.Y = 63.0}, 
        New PointD() With {.X = 170.2,.Y = 73.6}, New PointD() With {.X = 175.2,.Y = 62.3}, New PointD() With {.X = 175.2,.Y = 57.7}, 
        New PointD() With {.X = 160.0,.Y = 55.4}, New PointD() With {.X = 165.1,.Y = 104.1}, New PointD() With {.X = 174.0,.Y = 55.5}, 
        New PointD() With {.X = 170.2,.Y = 77.3}, New PointD() With {.X = 160.0,.Y = 80.5}, New PointD() With {.X = 167.6,.Y = 64.5}, 
        New PointD() With {.X = 167.6,.Y = 72.3}, New PointD() With {.X = 167.6,.Y = 61.4}, New PointD() With {.X = 154.9,.Y = 58.2}, 
        New PointD() With {.X = 162.6,.Y = 81.8}, New PointD() With {.X = 175.3,.Y = 63.6}, New PointD() With {.X = 171.4,.Y = 53.4}, 
        New PointD() With {.X = 157.5,.Y = 54.5}, New PointD() With {.X = 165.1,.Y = 53.6}, New PointD() With {.X = 160.0,.Y = 60.0}, 
        New PointD() With {.X = 174.0,.Y = 73.6}, New PointD() With {.X = 162.6,.Y = 61.4}, New PointD() With {.X = 174.0,.Y = 55.5}, 
        New PointD() With {.X = 162.6,.Y = 63.6}, New PointD() With {.X = 161.3,.Y = 60.9}, New PointD() With {.X = 156.2,.Y = 60.0}, 
        New PointD() With {.X = 149.9,.Y = 46.8}, New PointD() With {.X = 169.5,.Y = 57.3}, New PointD() With {.X = 160.0,.Y = 64.1}, 
        New PointD() With {.X = 175.3,.Y = 63.6}, New PointD() With {.X = 169.5,.Y = 67.3}, New PointD() With {.X = 160.0,.Y = 75.5}, 
        New PointD() With {.X = 172.7,.Y = 68.2}, New PointD() With {.X = 162.6,.Y = 61.4}, New PointD() With {.X = 157.5,.Y = 76.8}, 
        New PointD() With {.X = 176.5,.Y = 71.8}, New PointD() With {.X = 164.4,.Y = 55.5}, New PointD() With {.X = 160.7,.Y = 48.6}, 
        New PointD() With {.X = 174.0,.Y = 66.4}, New PointD() With {.X = 163.8,.Y = 67.3
        }
    }
    Return original
End Function

WinForms バブルチャート

バブルチャートは散布図に似ていますが、3 つめの次元をプロットする必要がある場合に使用されます。この 3 つめの次元は、バブルのサイズによって表されます。このチャートは財務データのプロットによく使用されます。たとえば、次のチャートは投資期間、投資額、および投資利益率の関係を表します。

WinForms バブルチャート

WinForms バブルチャートの作成

これらのチャートは、FlexChart クラスにある ChartType プロパティを Bubble に設定することによって作成できます。このプロパティは、C1.Chart 名前空間の ChartType 列挙に含まれる値を受け取ります。デフォルトで FlexChart は、丸記号と標準スタイルを使用してバブルチャートをレンダリングします。 ただし、これは系列の SymbolMarker および SymbolStyle プロパティを設定することで変更できます。バブルの最大サイズと最小サイズを定義することもできます。それには BubbleMaxSize および BubbleMinSize プロパティを設定します。

FlexChart には、バブルチャートを回転させるオプションもあり、X 軸を縦軸、Y 軸を横軸としてレンダリングできます。バブルチャートを回転させるには、Rotated プロパティを true に設定します。

FlexChart を使用してバブルチャートを作成するには

設計時

  1. フォームで FlexChart コントロールを右クリックして[プロパティ]ウィンドウを開きます。
  2. ChartType プロパティに移動して、その値を Bubble に設定します。
  3. DataSource プロパティを使用してデータソースを設定します。
  4. BindingX および Binding プロパティを設定して、X 軸と Y 軸の値をそれぞれ構成します。

コードの使用

WinForms バブルチャートをコードで作成するには、コントロールを初期化した後に、最初にデフォルトの系列をクリアし、Add メソッドを使用して新しい系列を追加します。DataSource プロパティを使用してデータソースを設定し、BindingX および Binding プロパティを設定して X 軸と Y 軸を構成します。また、ChartType などの必要なプロパティを使用して、チャートを設定する必要があります。

this.flexChart1.Series.Clear();

this.flexChart1.Header.Content = "Futures & Commodities Investment Analysis";

this.flexChart1.BindingX = "Year";
this.flexChart1.Options.BubbleMaxSize = 60;
this.flexChart1.Options.BubbleMinSize = 10;

Series series = new Series { Binding = "Number of Employees,Annual Revenue" };
this.flexChart1.Series.Add(series);

this.flexChart1.ChartType = ChartType.Bubble;
this.flexChart1.DataSource = GetData();
Me.flexChart1.Series.Clear()

Me.flexChart1.Header.Content = "Futures & Commodities Investment Analysis"

Me.flexChart1.BindingX = "Year"
Me.flexChart1.Options.BubbleMaxSize = 60
Me.flexChart1.Options.BubbleMinSize = 10

Dim series As New Series() With {
     .Binding = "Number of Employees,Annual Revenue"
}
Me.flexChart1.Series.Add(series)

Me.flexChart1.ChartType = ChartType.Bubble
Me.flexChart1.DataSource = GetData()

上記のサンプルコードは、GetData という名前のカスタムメソッドを使用してデータを提供しています。要件に基づいてデータソースを設定できます。

/// <summary>
/// FlexChartのデータを作成するメソッド
/// </summary>
public static DataTable GetData()
{
    // datatableを作成します
    DataTable dt = new DataTable("Company XYZ,2003-2015");

    // 列をdatatableに追加します
    dt.Columns.Add("Year", typeof(int));
    dt.Columns.Add("Number of Employees", typeof(int));
    dt.Columns.Add("Annual Revenue", typeof(int));

    // 行をdatatableに追加します
    dt.Rows.Add(2003, 18, 50);
    dt.Rows.Add(2004, 20, 55);
    dt.Rows.Add(2005, 41, 80);
    dt.Rows.Add(2006, 64, 100);
    dt.Rows.Add(2007, 82, 130);
    dt.Rows.Add(2008, 105, 160);
    dt.Rows.Add(2009, 120, 130);
    dt.Rows.Add(2010, 65, 105);
    dt.Rows.Add(2011, 67, 106);
    dt.Rows.Add(2012, 63, 100);
    dt.Rows.Add(2013, 61, 110);
    dt.Rows.Add(2014, 79, 115);
    dt.Rows.Add(2015, 82, 120);

    return dt;
}
''' <summary>
''' FlexChartのデータを作成するメソッド
''' </summary>
Public Shared Function GetData() As DataTable
    ' datatableを作成します
    Dim dt As New DataTable("Company XYZ,2003-2015")

    ' 列をdatatableに追加します
    dt.Columns.Add("Year", GetType(Integer))
    dt.Columns.Add("Number of Employees", GetType(Integer))
    dt.Columns.Add("Annual Revenue", GetType(Integer))

    ' 行をdatatableに追加します
    dt.Rows.Add(2003, 18, 50)
    dt.Rows.Add(2004, 20, 55)
    dt.Rows.Add(2005, 41, 80)
    dt.Rows.Add(2006, 64, 100)
    dt.Rows.Add(2007, 82, 130)
    dt.Rows.Add(2008, 105, 160)
    dt.Rows.Add(2009, 120, 130)
    dt.Rows.Add(2010, 65, 105)
    dt.Rows.Add(2011, 67, 106)
    dt.Rows.Add(2012, 63, 100)
    dt.Rows.Add(2013, 61, 110)
    dt.Rows.Add(2014, 79, 115)
    dt.Rows.Add(2015, 82, 120)

    Return dt
End Function