Binding Aggregate Values from C1FlexGrid to C1Chart for Silverlight

Chart and Grid are commonly used controls. Grid control is used to display the factual data while Chart control is used to analyze that data. In this blog, we will look at a simple plotting demonstration of the aggregate values of the Grouped Rows from C1FlexGrid into C1Chart for Silverlight. We will bind C1FlexGrid to a CollectionViewSource and define the required GroupDescriptions. Once we have the Grouped View of the data in the grid, we will move forward to binding the Chart to the aggregate values of the Grouped Rows. Since we are looking to plot the aggregate values of the Grouped Rows, the basic binding source for C1Chart will be the collection of GroupRows in C1FlexGrid. Thus, we will have to retrieve the list of GroupRows.

List<GroupRow> grt = new List<GroupRow>();  

foreach (Row gr in _flex.Rows)  
{  
   if (gr.GetType() == typeof(C1.Silverlight.FlexGrid.GroupRow))  
   {  
      GroupRow grw = gr as GroupRow;  
      grt.Add(grw);  
   }  
}  

c1Chart1.Data.ItemsSource = grt;

Define the Labels on the X Axis using the ItemNameBinding. This will be bound to the name of the field used for Grouping the grid data.

c1Chart1.Data.ItemNameBinding = new Binding("Group.Name");

Next is binding the Chart to the field which will be the source of values to be plotted. But here's the catch: Our objective is displaying the aggregate values which are not part of any field in the CollectionViewSource. How does the Chart control get these values? We make use of IValueConverter class to provide the values from the Grouped Rows. The Chart is already bound to the collection of GroupedRows. IValueConverter class is defined to return the required value from the GroupedRow. First, we look at the code to define the Binding for C1Chart values:

Binding bnd = new Binding();  
bnd.Path = new PropertyPath("");  
bnd.Converter = new CostValueConverter("Cost");  
c1Chart1.Data.Children.Add(new C1.Silverlight.Chart.DataSeries() { ValueBinding = bnd });

If we look at the above code, we can see the use of CostValueConverter. This is the converter class which will return the value of the aggregate field passed on as the argument. Now lets have a glance at the code used in CostValueConverter class:

class CostValueConverter : IValueConverter  
{  
   string _field;  
   public CostValueConverter(string field)  
   {  
      _field = field;  
   }  
   public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)  
   {  
      return (value as GroupRow).GetDataRaw((value as GroupRow).Grid.Columns[_field]);  
   }  

   public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)  
   {  
      throw new NotImplementedException();  
   }  
}

Once we have the above code in the right place, the final output will look similar to the image below: Download Sample