ChartControl コントロールを使用して C# .NET で折れ線グラフを作成する方法

2年 ago
結衣, 春花
1 minute

チャートコントロールを使用して折れ線グラフを作成するには、次の手順を実行します。

  1. まず、チャートコントロールをフォームまたはユーザーコントロールに追加します。この作業は、ツールボックスからデザインビューにコントロールをドラッグアンドドロップするか、コードから動的に作成することによって実行できます。
  2. コードでは、ChartControlコントロールのスタイルとプロパティを設定できます。タイトル、軸ラベル、軸目盛りなどを設定するだけでなく、曲線の色、線型、データシリーズなども設定できます。
  3. 准备数据。将要显示的曲线数据存储在一个数据源（如List、DataTable等）中。
  4. ChartControl コントロールの Series プロパティを使用して折れ線グラフを作成します。Add メソッドを使用すると、曲線ごとに 1 つのシリーズを表す複数の折れ線グラフを追加できます。
  5. 折れ線グラフシリーズにデータソースをバインドするにはSeriesのDataSourceプロパティを設定して、X軸およびY軸のデータフィールドをXValueMemberとYValueMembersプロパティで指定します。
  6. 最後に、ChartControl コントロールの Refresh メソッドを呼び出して折れ線グラフを更新します。

以下に、ChartControl コントロールを使用して折れ線グラフを作成するサンプル コードを示します。

using System;
using System.Collections.Generic;
using System.Windows.Forms;
using DevExpress.XtraCharts;
namespace ChartControlExample
{
public partial class Form1 : Form
{
public Form1()
{
InitializeComponent();
// 设置标题
chartControl1.Titles.Add(new ChartTitle() { Text = "曲线图示例" });
// 创建曲线系列
Series series1 = new Series("曲线1", ViewType.Line);
Series series2 = new Series("曲线2", ViewType.Line);
// 准备数据
List<DataPoint> dataPoints1 = new List<DataPoint>();
List<DataPoint> dataPoints2 = new List<DataPoint>();
// 添加数据
for (int i = 0; i <= 10; i++)
{
dataPoints1.Add(new DataPoint(i, Math.Sin(i)));
dataPoints2.Add(new DataPoint(i, Math.Cos(i)));
}
// 绑定数据
series1.DataSource = dataPoints1;
series1.ArgumentDataMember = "X";
series1.ValueDataMembers.AddRange(new string[] { "Y" });
series2.DataSource = dataPoints2;
series2.ArgumentDataMember = "X";
series2.ValueDataMembers.AddRange(new string[] { "Y" });
// 添加曲线系列到图表控件
chartControl1.Series.AddRange(new Series[] { series1, series2 });
// 刷新图表
chartControl1.Refresh();
}
}
public class DataPoint
{
public double X { get; set; }
public double Y { get; set; }
public DataPoint(double x, double y)
{
X = x;
Y = y;
}
}
}

このサンプルでは、sin(x)とcos(x)の2つの曲線を持つ折れ線グラフが作成されています。系列のDataSourceプロパティを設定することで折れ線系列にデータソースがバインドされ、XValueMemberとYValueMembersプロパティを設定することでX軸とY軸のデータフィールドが指定されています。最後に、ChartControlのRefreshメソッドを呼び出すことでグラフが更新されます。

bannerAds