原文来源:Using Data Binding with the UltraChart,有删节补充。
一般的UltarChart控件支持良种数据绑定的方法。第一种方法是传统的.NET数据绑定,其通过DataSource属性设置控件的数据源,然后调用DataBind()以绑定数据,这也是本文介绍的重点;第二种方法是借助Series对象给控件提供数据。
一、不同图表构成上的数据差异
UltraChart控件包含各种图形展示,比如列状图(Column Chart) 、扇形图(Scatter chart)、线状图(Line Chart) 等,各常见图对图形展示的数据要求不尽相同,具体参见表1。
图表类型 | 数据要求 |
Column Chart | at least one numeric column |
Bar Chart | at least one numeric column |
Candlestick Chart | four numeric columns for data points |
Pie Chart | one numeric column |
Point Chart | at least one numeric column |
Bubble Chart | three numeric columns for 2D rendering and four numeric columns for 3D rendering |
Spline Chart | at least one numeric column |
Cylinder Bar Chart | at least one numeric column |
Scatter Chart | two numeric columns for 2D rendering and three numeric columns for 3D rendering |
表一 常见图数据展示时的最低数据要求
表一表明,如果您要生成列图,其绑定的DataTable中至少要有一列存储的是数值信息(int数据、double数据等),而且尽管没做要求,DataTable中要包含一个储存String信息的列。下列代码符合列图展示的数据要求(实际含义:某星期出售ActiveX控件的量)
DataTable dt = new DataTable();
dt.Columns.Add("Week", typeof(System.String));
dt.Columns.Add("ActiveX", typeof(System.Int32));
dt.Rows.Add(new object[] {"Week 1", 50});
上述单纯的展示某一列的数据没什么意义,要使得图表展示得有意义,需要多列数据的参与,比如我们想看下某星期出售某些产品的情况,我们只需要相应添加几个数值列,参见下列代码
DataTable dt = new DataTable();
dt.Columns.Add("Week", typeof(System.String));
dt.Columns.Add("ActiveX", typeof(System.Int32));
dt.Columns.Add("Java", typeof(System.Int32));
dt.Columns.Add("NET", typeof(System.Int32));
dt.Rows.Add(new object[] {"Week 1", 50, 15, 79});
上述代码的实现效果参见图1
图1 某星期出售控件的情况
二、系列数据的添加
目前所代码展现的列图,局限于二维层面:每种产品的销售情况。如果我们想看三个星期来此类产品的销售情况,又该怎么处理呢?这意味着我们要增加个视角:星期。此种情况下我们得到数据的三维层面,这通常称为Series,添加多行这样的Series数据即为系列数据。沿用上述代码场景,我们添加了系列数据以给我们增加新的视角。
DataTable dt = new DataTable();
dt.Columns.Add("Week", typeof(System.String));
dt.Columns.Add("ActiveX", typeof(System.Int32));
dt.Columns.Add("Java", typeof(System.Int32));
dt.Columns.Add("NET", typeof(System.Int32));
dt.Rows.Add(new object[] {"Week 1", 50, 15, 79});
dt.Rows.Add(new object[] {"Week 2", 45, 17, 72});
dt.Rows.Add(new object[] {"Week 3", 57, 12, 83});
dt.Rows.Add(new object[] {"Week 4", 55, 14, 85});
dt.Rows.Add(new object[] {"Week 5", 31, 19, 70});
绑定上述DataTable后的列图效果参见图2。
图2 5星期以来出售控件的情况
图2中X轴线下的标签“Week {n}“用以区别彼此,其由表DataTable中第一个字符列名”Week”的值生成。
三、关键属性设置
上述数据展示满足一般的需求,但要得到些特殊的数据展示要求,沿用上述的代码场景,如果要查看某些产品五星期的销售情况,比如我们不需要查看控件ActiveX的销售情况等等,我们的这些要求,大体上我们可以重新定义DataTable,得到恰当的表结构或者得到我们所需要的数据予以绑定。实际上,我们大可不必这么大费周章,UltraChart提供了些属性或方法,通过设置,可以很方便的达成目的,具体包括SwapRowsAndColumns属性,UseRowLabelsColumn属性和IncludeColumns方法。
1、SwapRowsAndColumns属性
SwapRowsAndColumns属性是个Boolean属性,如字面所包含意义那样,其通告图表将列字段作为行字段用。图三中左图显示的每星期产品的销售情况,右图显示的是每产品的周销售情况。
图3 SwapRowAndColumns属性设置
为了得到新图效果,你仅仅只需设置SwapRowsandColumns属性为true: this.ultraChart1.Data.SwapRowsAndColumns=true;做上述设置后,DataTable表数据效果参见图4
图4 SwapRowAndColumns为true后的DataTable效果图
2、IncludeColumns方法
对具体DataTable表来说,UltraChart控件的IncludeColumns方法允许你设置哪些列不需要显示,你只需要知道这些列的index号。沿用上述的代码场景,只是我们增加一个列“Totals”,其统计每月售出产品的总数,当然其是数值列,变更后的代码片段如下:
DataTable dt = new DataTable();
dt.Columns.Add("Week", typeof(System.String));
dt.Columns.Add("ActiveX", typeof(System.Int32));
dt.Columns.Add("Java", typeof(System.Int32));
dt.Columns.Add("NET", typeof(System.Int32));
dt.Columns.Add("Totals", typeof(System.Int32));
dt.Rows.Add(new object[] {"Week1", 50, 15, 79, 144});
dt.Rows.Add(new object[] {"Week2", 45, 17, 72, 134});
dt.Rows.Add(new object[] {"Week3", 57, 12, 83, 152});
dt.Rows.Add(new object[] {"Week4", 55, 14, 85, 154});
dt.Rows.Add(new object[] {"Week5", 31, 19, 70, 120});
然后我们添加如下代码:this.ultraChart1.Data.IncludeColumn(4,false);其添加前后的列图展示效果参见图5。图5左是Totals列存在的情况,图5右是Totals列不包括其内的情况:
图5 IncludeColumns方法使用前后效果图
3、UseRowLabelsColumn 与 RowLabelsColumn属性
UseRowLabelsColumn 与 RowLabelsColumn属性适用于以下场景:要绑定到UltraChart的数据本身有两个或更多的列,其都是String类型,都适合做系列数据的标签,你会选择哪一个来做系列数据的标签呢?默认情况下,UltraChart会选择DataTable表中序号在前的String类型列作为系列数据标签,这会满足你的真实要求么?碰到这样的情况, UseRowLabelsColumn属性会告诉图表你想自己来定义哪列值作为系列数据的标签列, the RowLabelsColumn属性则会来具体设置这个列值。仍然沿用上述场景,代码做如下变更:
DataTable dt = new DataTable();
dt.Columns.Add("Notes",typeof(System.String));
dt.Columns.Add("ActiveX", typeof(System.Int32));
dt.Columns.Add("Java", typeof(System.Int32));
dt.Columns.Add("NET", typeof(System.Int32));
dt.Columns.Add("Week", typeof(System.String));
dt.Rows.Add(new object[] {"Convention in town. Strong sales", 50, 15, 79, "Week1"});
dt.Rows.Add(new object[] {"", 45, 17, 72, "Week2"});
dt.Rows.Add(new object[] {"", 57, 12, 83, "Week3"});
dt.Rows.Add(new object[] {"", 55, 14, 85, "Week4"});
dt.Rows.Add(new object[] {"Holiday Week, slow sales", 31, 19, 70, "Week5"});
然后我们添加如下代码: this.ultraChart1.Data.UseRowLabelsColumn=true; this.ultraChart1.Data.RowLabelsColumn=4;
其添加前后的列图展示效果参见图6。图6左是默认数据绑定效果,图6右是设置属性UseRowLabelsColumn 与 RowLabelsColumn后的效果
图6 UseRowLabelsColumn 与 RowLabelsColumn设置前后效果图
四、总结
用传统的.NET数据绑定方法处理UltraChart数据绑定,显得简单,效果明显!你只需要记住各UltraChart控件的特定数据源要求,此外了解并熟悉其关键属性、方法:SwapRowsAndColumns属性,UseRowLabelsColumn属性和IncludeColumns方法。此外,碰到任何问题,欢迎访问论坛http://forums.infragistics.com/ 。