StackedBar Chart Help

[Michael]

Hey guys,

I'm trying to use the Telerik Chart Control after purchasing the ASP.NET Ajax control yesterday from yourselves, but i can't seem to get the bar chart to be stacked...

Here is my code: (ASP.NET)

<telerik:RadChart ID="RadChart1" runat="server" DefaultType="StackedBar">
            <PlotArea>
                <YAxis MaxValue="300" Step="10" AutoScale="True"  AxisMode="Extended">
                </YAxis>

            </PlotArea>
            <Series>

            </Series>
        </telerik:RadChart>

and my c#:

string sql = string.Format("...");
DataTable openLeads = db.FillTable(sql);


if (openLeads.Rows.Count > 0)
{
    RadChart1.DataSource = openLeads;

    foreach (DataRow row in openLeads.Rows)
    {
        ChartSeries chrtSeries = new ChartSeries {Name = row["Description"].ToString()};
        chrtSeries.Type = ChartSeriesType.StackedBar;
        RadChart1.SeriesOrientation = ChartSeriesOrientation.Vertical;
        RadChart1.Series.Add(chrtSeries);

    }
    RadChart1.PlotArea.XAxis.DataLabelsColumn = "UserName";
    RadChart1.DataBind();
}

my sql query produces these results:


Description                                                    Count              Username
Passed back to sales - query log                 1                      TAtest
Rejected                                                       2                     TAtest
Telesales Assigned TA                                 1                     TAtest

I want the y-axis to be 10-300 in steps of 10.. min of 10
I want the x-axis to be the username
and the count of each Description to be each bar stacked per username..

Please see attachment of what i'm currently getting..

Thanks for any help,

Regards,

Michael

[Petar Marchev]

Hi Michael,

Since you are new to our controls I strongly suggest that you invest some time examining our online demos and help so that you get familiar with the chart's features, limitations and how-to's.

I have pasted some code below to get you started with the looks that you want to achieve. In short you need to create a series for each item from your source. Each series must hold this single item. 

public partial class _Default : System.Web.UI.Page
{
 protected void Page_Load(object sender, EventArgs e)
 {
  var prods = new List<Product>()
  {
    new Product() { ProductId = 1, Name = "prod1", Sales = 5, },
    new Product() { ProductId = 2, Name = "prod2", Sales = 4, },
    new Product() { ProductId = 3, Name = "prod3", Sales = 3, }
  };

  foreach (var p in prods)
  {
    ChartSeries series = new ChartSeries();
    series.Type = ChartSeriesType.StackedBar;
    series.Items.Add(new ChartSeriesItem(p.Sales));
    this.RadChart1.Series.Add(series);
  }

  this.RadChart1.PlotArea.XAxis.AutoScale = false;
  this.RadChart1.PlotArea.XAxis.AddRange(0, 0, 1);
  this.RadChart1.PlotArea.XAxis.Items[0].TextBlock.Text = "prod1 or prod2 or prod3";
 }
}

public class Product
{
  public string Name { get; set; }
  public int ProductId { get; set; }
  public int Sales { get; set; }
}

In your code you did not add items to the series manually, but you specified a data source for the chart and this is why you were getting unexpected results.

I have also attached a snapshot of the output that I get when I run this code.

All the best,
Petar Marchev
the Telerik team