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

Stacked Bar Chart Alignment

1 Answer 53 Views
Chart (Obsolete)
This is a migrated thread and some comments may be shown as answers.
Michael
Top achievements
Rank 2
Iron
Iron
Iron
Michael asked on 27 Jan 2012, 01:58 PM
Reference the attached image.  The XAxis labels are perfectly centered between the major grid lines however the series items (as stacked bar chart) are not.  I've seen numerous examples within the help documentation of the stacked bar chart showing the bars centered between the major grid lines as well as the labels but without the markup for it there is no way to see how it was done.  Can someone please tell me how to get this aligned properly (what property/attribute sets it) and what, if any, related properties/attributes need to be set to (i.e. auto-layout enabled or disabled, auto-scale - true or false, etc.).

1 Answer, 1 is accepted

Sort by
0
Yavor
Telerik team
answered on 31 Jan 2012, 10:42 AM
Hello Michael,

Bar series are most properly displayed using categories. For example if you have 4 categories (A, B, C and D) and you want to map 4 values to them you can do something like this:

protected void Page_Load(object sender, EventArgs e)
{
    var data = new List<Tuple<string, double>>()
    {
        new Tuple<string, double>("A", 12),
        new Tuple<string, double>("B", 22),
        new Tuple<string, double>("C", 17),
        new Tuple<string, double>("D", 27),
    };
    this.chart1.DataSource = data;
    this.chart1.PlotArea.XAxis.DataLabelsColumn = "Item1";
    this.chart1.DataManager.ValuesYColumns = new string[] { "Item2" };
    this.chart1.DataBind();
}

You can also achieve the same effect by adding your data manually. Here is some code:
protected void Page_Load(object sender, EventArgs e)
{
    this.chart1.PlotArea.XAxis.AutoScale = false;
    this.chart1.PlotArea.XAxis.AddItem("A");
    this.chart1.PlotArea.XAxis.AddItem("B");
    this.chart1.PlotArea.XAxis.AddItem("C");
    this.chart1.PlotArea.XAxis.AddItem("D");
    var series = new Telerik.Charting.ChartSeries();
    series.AddItem(12);
    series.AddItem(22);
    series.AddItem(17);
    series.AddItem(27);
    this.chart1.Series.Add(series);
}

Hope this helps! Greetings,
Yavor
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
Tags
Chart (Obsolete)
Asked by
Michael
Top achievements
Rank 2
Iron
Iron
Iron
Answers by
Yavor
Telerik team
Share this question
or