DEV ChartControl绑定DataTable多系列多数据详细讲解

原创

于 2017-03-06 16:08:21 发布 · 4.8k 阅读

14 ·

CC 4.0 BY-SA版权

文章标签：

#数据库 #控件 #c# #devexpress

本文详细介绍了如何使用DevExpress的ChartControl控件进行数据绑定，特别是从数据库的DataTable中获取数据，并创建多系列多数据的图表。通过调整DataTable来控制横坐标显示隐藏，实现了对数据的精细控制。在数据加载方面，提供了两种不同的方法，一种是通过设置DataSource直接绑定，另一种是手动添加SeriesPoint。此外，还讨论了通过TreeView选择横坐标并利用DataTable的select()方法进行过滤，以提高性能并减少数据库交互。

dev的chartcontrol控件其实是很强大的，可以根据数据库直接绑定DataSouce，也可以自己为它的每一个系列添加坐标点，即一个包含横坐标和纵坐标的SeriesPoint，这些都是可以通过这个控件自带的属性和方法解决的，难点在于控制横坐标的显示和隐藏，我找了很久没有找到控制横坐标显示隐藏的属性，迫不得已采用更改数据源也就是DataTable的办法来控制，以下就是详细过程。

这是做好后的效果图，左侧是横坐标，可以任意勾选，底部是各系列，也可任意勾选

首先就是我们要用到的数据源，这里我用到的是数据库中的一个表，大致内容如下：

组别	横坐标（月份）	纵坐标（小时）
用户1	2011-05	6.38
用户2	2011-05	55.1
用户3	2011-06	22.6
…	…	…

很容易看出来这是进行了两次细分的，首先是组别，而后又是横坐标。

设计过程：加载数据，函数如下，第一个参数当然是我们的数据源了：

 private void LoadDataSouce(DataTable dt, Boolean isLoadTreeView)
        {
            chartControl1.Series.Clear();
            if (dt == null) return;
            //组别名
            seriesName = dt.Columns[0].ColumnName;
            //横坐标名
            abscissaName = dt.Columns[1].ColumnName;
            //纵坐标名
            valueName = dt.Columns[2].ColumnN

最低0.47元/天解锁文章