面グラフは、一定期間のデータの変化を表します。Y 軸のデータポイント間を接続し、系列と X 軸の間の領域を埋めることで、データ系列を表現します。さらに、データ系列は、追加されたときと同じ順番で背面から前面に表示されます。

FlexChart を使用すると、設計時および実行時の両方で面グラフを作成できます。設計時の場合は、プロパティウィンドウで ChartType プロパティを Area に設定し、実行時の場合は同じプロパティをコードで設定します。

Stacking プロパティを Stacked または Stacked100pc に設定すると、積層面グラフを作成できます。

AAPL、CIEN、INTC という 3 つの株式銘柄があるとします。これらは株式市場で 2013 から 2015 年まで継続して高値を付けています。2015 年末に、これらの株が対前年比で上昇したか下落したかを（株価に基づいて）特定する分析を行います。分析は、2013 年、2014 年、2015 年の株価に基づいて行われます。

株価は一定期間で変動するデータなので、このシナリオには面グラフが適しています。

サンプルデータテーブル

株式銘柄	2013	2014	2015
AAPL	95	109	120
CIEN	89	104	115
INTC	75	95	110

重要ポイント

面グラフ

上のチャートは、プロットされた 3 年間の株価によって株価が上昇していることを示しています。3 つの株価の 3 つの領域が 3 色でレンダリングされています。

系列の数：3（AAPL、CIEN、INTC）
ポイントごとの Y 値の数：1

次のコードは、このシナリオの実装です。

Visual Basic
C#

Visual Basic

' データ系列コレクションをクリアします
FlexChart1.Series.Clear()

' データ系列を作成します
Dim series1 As New C1.Win.Chart.Series()
Dim series2 As New C1.Win.Chart.Series()
Dim series3 As New C1.Win.Chart.Series()

' データ系列にデータポイントを追加します
series1.BindingX = "X"
series1.Binding = "Y"
series1.DataSource = New System.Drawing.Point() {
New System.Drawing.Point(2013, 95),
New System.Drawing.Point(2014, 109),
New System.Drawing.Point(2015, 120)}
series1.Name = "AAPL"

series2.BindingX = "X"
series2.Binding = "Y"
series2.DataSource = New System.Drawing.Point() {
New System.Drawing.Point(2013, 89),
New System.Drawing.Point(2014, 104),
New System.Drawing.Point(2015, 115)}
series2.Name = "CIEN"

series3.BindingX = "X"
series3.Binding = "Y"
series3.DataSource = New System.Drawing.Point() {
New System.Drawing.Point(2013, 75),
New System.Drawing.Point(2014, 95),
New System.Drawing.Point(2015, 110)}
series3.Name = "INTC"

' データ系列コレクションにデータ系列を追加します
FlexChart1.Series.Add(series1)
FlexChart1.Series.Add(series2)
FlexChart1.Series.Add(series3)

' チャートタイプを面グラフに設定します
FlexChart1.ChartType = C1.Chart.ChartType.Area

// データ系列コレクションをクリアします
flexChart1.Series.Clear();

// データ系列を作成します
C1.Win.Chart.Series series1 = new C1.Win.Chart.Series();
C1.Win.Chart.Series series2 = new C1.Win.Chart.Series();
C1.Win.Chart.Series series3 = new C1.Win.Chart.Series();

// データ系列にデータポイントを追加します
series1.BindingX = "X";
series1.Binding = "Y";
series1.DataSource = new System.Drawing.Point[] { 
new System.Drawing.Point(2013,95),
new System.Drawing.Point(2014,109),
new System.Drawing.Point(2015,120) };
series1.Name = "AAPL";

series2.BindingX = "X";
series2.Binding = "Y";
series2.DataSource = new System.Drawing.Point[] { 
new System.Drawing.Point(2013,89),
new System.Drawing.Point(2014,104),
new System.Drawing.Point(2015,115) };
series2.Name = "CIEN";

series3.BindingX = "X";
series3.Binding = "Y";
series3.DataSource = new System.Drawing.Point[] { 
new System.Drawing.Point(2013,75),
new System.Drawing.Point(2014,95),
new System.Drawing.Point(2015,110) };
series3.Name = "INTC";

// データ系列コレクションにデータ系列を追加します
flexChart1.Series.Add(series1);
flexChart1.Series.Add(series2);
flexChart1.Series.Add(series3);

// チャートタイプを面グラフに設定します
flexChart1.ChartType = C1.Chart.ChartType.Area;