绑定提供了一种在 FlexChart 和应用程序数据之间创建链接的方法。FlexChart 允许您绑定来自数据库的数据以及存储在其他结构(如数组和集合)中的数据。本主题讨论向图表提供数据的三种方法。
图表绑定是最简单的绑定形式,只需通过设置 DataSource 属性来设置数据源,然后将 Binding(Y轴绑定字段) 和
BindingX(X轴绑定字段) 属性分别映射到要在图表的 Y 轴和 X 轴上绘制的字段。
我们提供了四种绑定表数据的方式。
1、绑定当前窗口中的表。我们需要设置“绑定表(BaseDataRuleGrid)”属性。
2、绑定其他窗口中的表。我们需要设置“绑定表字符版(BindingDataRuleGrid)”属性。
3、绑定SQL语句返回的表。我们需要设置DatabaseName(数据源名称)属性和SqlCommandText(SQL命令)属性。
4、用代码直接绑定表。我们上面的几种设置数据源的本质都是最终设置DataSource属性。类似这种效果:flexChart1.DataSource=SmGrid.DataTableHelp.DataTable。
Vb.Net |
Dim db As Database=Proj.SysDataFactory("UserDB") '通过数据源和SQL语句获得数据 Dim dt As DataTable=db.ExecuteDataTable("select * From UserInfo") '获得图表控件的引用 Dim flexChart1 As SmFlexChart= Proj.OpenedForms("图表").ControlDictionary()("SmFlexChart1") flexChart1.DataSource=dt |
C# |
Database db = Proj.SysDataFactory["UserDB"]; // 通过数据源和SQL语句获得数据 DataTable dt = db.ExecuteDataTable("select * From UserInfo"); // 获得图表控件的引用 SmFlexChart flexChart1 = Proj.OpenedForms["图表"].ControlDictionary()["SmFlexChart1"] as SmFlexChart; //加载数据源 flexChart1.DataSource = dt; |
DataSource属性还支持绑定其他数组和集合类型的数据。
Vb.Net |
'清空当前图系中的内容 flexChart1.Series.Clear() '绑定数据 flexChart1.DataSource = GetTemperatureData("Tokyo", 360).First().Data '设置图表的标题 flexChart1.Header.Content = "Tokyo Average Precipitation Report | 2018" '绑定图表的X轴到字段'Date' flexChart1.BindingX = "Date" '将图系添加到图表,指定要在图例中显示的与该图系相对应的字符串 flexChart1.Series.Add(New Series() With { .Name = "Precipitation", .Binding = "Precipitation" }) |
C# |
//清空当前图系中的内容 flexChart1.Series.Clear(); //绑定数据 flexChart1.DataSource = GetTemperatureData("Tokyo", 360).First().Data; //设置图表的标题 flexChart1.Header.Content = "Tokyo Average Precipitation Report | 2018"; //绑定图表的X轴到字段'Date' flexChart1.BindingX = "Date"; //将图系添加到图表,指定要在图例中显示的与该图系相对应的字符串 flexChart1.Series.Add(new Series { //Name property specifies the string to be displayed corresponding to this Series in Legend Name = "Precipitation", Binding = "Precipitation" }); |
轴绑定
轴绑定是指将轴与单独的数据源绑定,以呈现不同于将图表与图表数据源绑定时显示的轴标签。例如,在上面的示例中,我们可以覆盖在与图表数据源绑定时自动呈现的 Y 轴标签,以显示以毫米为单位的降水量值。FlexChart 提供“数据源”和“绑定”属性,以便您可以将轴绑定到另一个数据源。
Vb.Net
'Passing data to FlexChart's AxisY
flexChart1.AxisY.DataSource = GetAxisBindinglabels()
'Setting which fields to bind to AxisY
flexChart1.AxisY.Binding = "Value,Text"
C# |
//Passing data to FlexChart's AxisY flexChart1.AxisY.DataSource = GetAxisBindinglabels(); //Setting which fields to bind to AxisY flexChart1.AxisY.Binding = "Value,Text"; |
图系绑定
在系列绑定中,可以将特定系列绑定到单独的数据源,并显示原始数据源中不存在的数据。例如,在上面两个部分的示例中,我们可以进一步添加另一个系列,以显示来自不同数据源的同一图表中的平均月降水量。
Vb.Net |
'Clearing default Series present in chart flexChart1.Series.Clear() 'Passing data to FlexChart flexChart1.DataSource = GetTemperatureData("Tokyo", 360).First().Data 'Setting FlexChart's Header and styling it flexChart1.Header.Content = "Tokyo Average Precipitation Report | 2018" 'Binding chart's AxisX to 'Date' flexChart1.BindingX = "Date" 'Adding a Series to chart and binding it's (AxisY) to 'Temperature' field of Data 'Name property specifies the string to be displayed corresponding to this Series in Legend flexChart1.Series.Add(New Series() With { .Name = "Precipitation", .Binding = "Precipitation" }) flexChart1.Series.Add(New Series() With { .Name = "Monthly Precipitation (Avg)", .Binding = "Value", .ChartType = ChartType.LineSymbols, .DataSource = monthlyData }) |
C# |
flexChart1.Series.Add(new Series { Name = "Monthly Precipitation (Avg)", Binding = "Value", ChartType = ChartType.LineSymbols, DataSource = monthlyData, }); |