DevExpress之ChartControl用法

DevExpress是一个著名的控件库，提供了许多强大的控件，其中包括ChartControl控件。ChartControl是一个强大的图表控件，可以将各种数据以清晰、易读的图表形式呈现出来，例如：柱状图、折线图、饼图等。本文将介绍ChartControl控件的使用方法，并附上一些实例说明，以帮助您更好地理解。

一、 ChartControl的基本属性

1. DataSource属性：

数据源属性是ChartControl控件中最重要的属性之一，它用于指定图表显示的数据源。我们可以让数据源指向跟当前控件绑定的数据源，也可以自定义数据源。

2. Diagram属性：

Diagram属性包含了ChartControl中的所有图表区域，用于在其中放置图表要素。在Diagram属性下面又有三个属性分别是X-Axis、Y-Axis和Secondary Axes，用于指定图表在X轴、Y轴和次要轴（针对某些图表）上绘制的数据。

3. Series属性：

Series属性指定了数据源中的一组数据如何绘制。我们可以在Series中添加多个SeriesItem，每个Series中都可以包含多个SeriesItem。

4. Legend属性：

Legend属性是图例属性，用于描述图表中使用的颜色和符号的含义。

5. Palette属性：

Palette属性用于指定图表中使用的颜色调色板。

二、 ChartControl的具体应用

1. 创建数据源

首先我们需要创建数据源，可以从数据库中读取数据，也可以在代码中手动添加数据源。在本例中，我们手动创建一个数据源，并添加五个数据项。

C#

//创建一个数据源

DataTable dt = new DataTable();

dt.Columns.Add("X",typeof(Int32));

dt.Columns.Add("Y",typeof(Int32));

dt.Rows.Add(1,10);

dt.Rows.Add(2,20);

dt.Rows.Add(3,40);

dt.Rows.Add(4,30);

dt.Rows.Add(5,50);

2. 设计ChartControl控件窗体

在新的窗口中添加ChartControl控件，并设置DataSource属性为上面手动创建的数据源 dt。添加Series属性，并将Series中名称设置为“Y”，同时指定Series中X和Y的对应项。在设置X值和Y值的时候，可以使用列名称或者索引均可。

C#

this.chartControl1.DataSource = dt;

DevExpress.XtraCharts.Series series = new DevExpress.XtraCharts.Series("Y",DevExpress.XtraCharts.ViewType.Bar);

series.ArgumentDataMember = "X";

series.ValueDataMembers.AddRange(new string[] {"Y"});

this.chartControl1.Series.Add(series);

3. 为图表添加标题和图例

可以通过设置Title属性和Legend属性来添加标题和图例。在本例中，我们在代码中为图表设置标题为“测试图表”。

C#

this.chartControl1.Titles.Add(new DevExpress.XtraCharts.Title("测试图表"));

4. 配置Diagram属性

在Diagram属性中可以设置图表的X轴和Y轴，以及次要轴，主要体现在图表中常见的坐标轴的设置和调整。在本例中，我们设置X轴的显示文本为“X”,设置X轴的刻度线位置在表格的底边缘。

C#

((DevExpress.XtraCharts.XYDiagram)this.chartControl1.Diagram).AxisX.Title.Text = "X";

((DevExpress.XtraCharts.XYDiagram)this.chartControl1.Diagram).AxisX.Title.WordWrap = true;

((DevExpress.XtraCharts.XYDiagram)this.chartControl1.Diagram).AxisX.Title.Antialiasing = true;

((DevExpress.XtraCharts.XYDiagram)this.chartControl1.Diagram).AxisY.Title.Text = "Y";

((DevExpress.XtraCharts.XYDiagram)this.chartControl1.Diagram).AxisY.Title.WordWrap = true;

((DevExpress.XtraCharts.XYDiagram)this.chartControl1.Diagram).AxisY.Title.Antialiasing = true;

((DevExpress.XtraCharts.XYDiagram)this.chartControl1.Diagram).AxisX.Alignment = DevExpress.XtraCharts.AxisAlignment.Zero;

((DevExpress.XtraCharts.XYDiagram)this.chartControl1.Diagram).AxisY.Alignment = DevExpress.XtraCharts.AxisAlignment.Zero;

5. 自定义ChartControl控件样式

可以通过设置Palette属性来设置ChartControl控件的样式。在本例中，我们为Palette属性设置了四种不同的颜色，包括红色、蓝色、黄色和绿色。

C#

DevExpress.XtraCharts.Palette myPalette = new DevExpress.XtraCharts.Palette("MyPalette");

myPalette.Colors.Add(System.Drawing.Color.Red);

myPalette.Colors.Add(System.Drawing.Color.Blue);

myPalette.Colors.Add(System.Drawing.Color.Yellow);

myPalette.Colors.Add(System.Drawing.Color.Green);

this.chartControl1.PaletteName = "MyPalette";

this.chartControl1.Palette = myPalette;

三、 ChartControl的实例应用

在实例中，我们将使用微软官方的Northwind数据库，对数据进行统计，生成图表。

1. 准备示例数据

使用以下查询从Northwind数据库中获取示例数据：

SQL

SELECT ShipCountry, COUNT(*) AS OrderCount FROM Orders GROUP BY ShipCountry

以下是查询结果截图：

2. 创建ChartControl控件窗体

在新的窗口中添加ChartControl控件，并设置DataSource属性为上面查询到的数据表，即sampleData。

C#

using System.Data.SqlClient;

using DevExpress.XtraCharts;

public partial class Form1 : Form

{

public Form1()

{

InitializeComponent();

}

private void Form1_Load(object sender, EventArgs e)

{

using (SqlConnection cn = new SqlConnection("[数据库连接字符串]"))

{

SqlCommand cmd = new SqlCommand("SELECT ShipCountry, COUNT(*) AS OrderCount FROM Orders GROUP BY ShipCountry", cn);

SqlDataAdapter da = new SqlDataAdapter(cmd);

DataTable dt = new DataTable();

da.Fill(dt);

this.chartControl1.DataSource = dt;

Series series = new Series("OrderCount", ViewType.Bar);

series.ArgumentDataMember = "ShipCountry";

series.ValueDataMembers.AddRange(new string[] { "OrderCount" });

this.chartControl1.Series.Add(series);

this.chartControl1.Titles.Add(new Title("订单数图表"));

}

}

}

3. 设计图表

在设计图表之前，需要先在控件属性中将PaletteName属性设置为None，即取消默认的颜色调色板。

C#

this.chartControl1.PaletteName = "None";

接下来，我们可以自定义图表样式，使用以下代码修改Series中的Appearance属性，为其添加深蓝色填充色和黑色的边框颜色。

C#

series.Appearance.FillStyle.FillMode = FillMode.Solid;

series.Appearance.FillStyle.Options.UseBackColor = true;

series.Appearance.FillStyle.BackColor = Color.FromArgb(79, 129, 189);

series.Appearance.BorderColor = Color.Black;

series.Appearance.BorderColor2 = Color.Black;

series.Appearance.OptionName = "BarNone";

接着，我们设置X轴和Y轴，并为其添加标题和对齐方式，以便更好地呈现数据。以下是示例代码：

C#

((XYDiagram)this.chartControl1.Diagram).AxisX.Title.Text = "国家";

((XYDiagram)this.chartControl1.Diagram).AxisX.Title.WordWrap = true;

((XYDiagram)this.chartControl1.Diagram).AxisX.Title.Antialiasing = true;

((XYDiagram)this.chartControl1.Diagram).AxisY.Title.Text = "订单数";

((XYDiagram)this.chartControl1.Diagram).AxisY.Title.WordWrap = true;

((XYDiagram)this.chartControl1.Diagram).AxisY.Title.Antialiasing = true;

((XYDiagram)this.chartControl1.Diagram).AxisX.Alignment = AxisAlignment.Zero;

((XYDiagram)this.chartControl1.Diagram).AxisY.Alignment = AxisAlignment.Zero;

4. 可视化分析

现在，我们已经完成了ChartControl控件的配置和图表设计。启动应用程序并打开图表窗体，即可看到下图所示的完整的订单数图表。 如果你喜欢我们三七知识分享网站的文章， 欢迎您分享或收藏知识分享网站文章 欢迎您到我们的网站逛逛喔！https://www.37seo.cn/