This is a migrated thread and some comments may be shown as answers.

summation of chart data table

1 Answer 141 Views
This is a migrated thread and some comments may be shown as answers.
Top achievements
Rank 1
matthew asked on 05 Aug 2014, 06:41 PM
Hi all

I have three questions:

First :I use telerik chart to create a chart for my
application. I want to insert column and row sum of chart data table below the
chart (the same as last column and row in attached image).I do it manually. Is
it possible to do it automatically?

Second:As you can see in the attached image, The last column
is the total sum of row.Is it possible that the last column shows just the
value not bar chart?


Third:is it possible to remove colored bullet  of total last row  from legend?

1 Answer, 1 is accepted

Sort by
Dess | Tech Support Engineer, Principal
Telerik team
answered on 07 Aug 2014, 11:16 AM
Hello Matthew,

Thank you for writing.

I am not sure how exactly you populate RadChartView with data, however please find below a sample code snippet demonstrating how to achieve similar look as the one in the screenshot. There is one horizontal RadSplitContainer with two panels, one for the RadGridView and one for the RadChartView. You can populate the RadChartView with the same data as the RadGridView. Additionally, add summary items to summarize the column values and add a calculated column to summarize the row values.
public Form1()
    BarSeries barSeries = new BarSeries("Performance", "RepresentativeName");
    barSeries.Name = "Q1";
    barSeries.LegendTitle = "Q1";
    barSeries.DataPoints.Add(new CategoricalDataPoint(221, "1"));
    barSeries.DataPoints.Add(new CategoricalDataPoint(161, "2"));
    barSeries.DataPoints.Add(new CategoricalDataPoint(149, "3"));
    barSeries.DataPoints.Add(new CategoricalDataPoint(127, "4"));
    barSeries.DataPoints.Add(new CategoricalDataPoint(110, "5"));
    BarSeries barSeries2 = new BarSeries("Performance", "RepresentativeName");
    barSeries2.Name = "Q2";
    barSeries2.LegendTitle = "Q2";
    barSeries2.DataPoints.Add(new CategoricalDataPoint(56, "1"));
    barSeries2.DataPoints.Add(new CategoricalDataPoint(65, "2"));
    barSeries2.DataPoints.Add(new CategoricalDataPoint(50, "3"));
    barSeries2.DataPoints.Add(new CategoricalDataPoint(43, "4"));
    barSeries2.DataPoints.Add(new CategoricalDataPoint(49, "5"));
    this.radChartView1.ShowLegend = true;
    this.radChartView1.LegendTitle = "Legend";
    StringBuilder sb = new StringBuilder();
    foreach (CategoricalDataPoint p in barSeries.DataPoints)
        GridViewDecimalColumn newColumn = new GridViewDecimalColumn("col" + p.Category.ToString());
        newColumn.HeaderText = p.Category.ToString();
        sb.AppendFormat("{0}{1}", "col" + p.Category.ToString(), " + ");
    sb.Remove(sb.ToString().Length - 3, 3);
    GridViewDecimalColumn col = new GridViewDecimalColumn("Total Column");
    radGridView1.Columns["Total Column"].Expression = sb.ToString();
    GridViewRowInfo row = this.radGridView1.Rows.AddNew();
    foreach (CategoricalDataPoint p in barSeries.DataPoints)
        row.Cells["col" + p.Category.ToString()].Value = p.Value;
    GridViewRowInfo row2 = this.radGridView1.Rows.AddNew();
    foreach (CategoricalDataPoint p in barSeries2.DataPoints)
        row2.Cells["col" + p.Category.ToString()].Value = p.Value;
    GridViewSummaryRowItem summaryRowItem = new GridViewSummaryRowItem();
    foreach (GridViewColumn column in this.radGridView1.Columns)
        GridViewSummaryItem summaryItem = new GridViewSummaryItem();
        summaryItem.Name = column.Name;
        summaryItem.Aggregate = GridAggregateFunction.Sum;
    this.radGridView1.AutoSizeColumnsMode = GridViewAutoSizeColumnsMode.Fill;

1: There is no automatic way to produce a RadGridView from the data inside a RadChartView. However, it can be easily achieved using the snippet above.

2: It is not necessary to add a CategoricalDataPoint in the BarSeries for the total data. Thus, the total bar would not be rendered at all.

3: In order to customize an item in the legend, you can use the ChartElement.LegendElement.VisualItemCreating event and perform the desired customization. Here is a code snippet, demonstrating how to hide a certain item:

private void LegendElement_VisualItemCreating(object sender, LegendItemElementCreatingEventArgs e)
    if (e.LegendItem.Title=="Q1")
        e.ItemElement = new LegendItemElement(e.LegendItem);
        e.ItemElement.Visibility = ElementVisibility.Collapsed;

I hope this information helps. Should you have further questions, I would be glad to help.

Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.
Asked by
Top achievements
Rank 1
Answers by
Dess | Tech Support Engineer, Principal
Telerik team
Share this question