X-Axis custom labels

[Mark Smith]

Hi there

We've started using the chart control, it works great however we have a requirement to put custom labels on the X-Axis.
Please take a look at this screenshot http://www.magnetism.co.nz/clients/telerik/telerik_chart.jpg

What we're trying to do is put "Month x" infront of the numbers
eg: Jan 1, Jan 2, Jan 3, Jan 4...etc

we're binding the chart to a custom List<T> object.

Can you please advice on how we can go about adding custom labels to the X-Axis

[Giuseppe]

Hello Mark Smith,

You can bind the axis label values by specifying the RadChart.PlotArea.XAxis.DataLabelsColumn property like this (you would set the property name of your custom business object):

ASPX

<telerik:RadChart ID="RadChart1" runat="Server" AutoLayout="true" />

Code-behind:

protected void Page_Load(object sender, EventArgs e)
{
    ChartSeries series = new ChartSeries();
    series.DataYColumn = "Value";

    RadChart1.PlotArea.XAxis.DataLabelsColumn = "LabelValue";
    RadChart1.PlotArea.XAxis.Appearance.LabelAppearance.RotationAngle = 320;

    RadChart1.Series.Add(series);
    RadChart1.DataSource = this.CreateSource();
    RadChart1.DataBind();
}

private DataTable CreateSource()
{
    DataTable dt = new DataTable();
    dt.Columns.Add("LabelValue", typeof(string));
    dt.Columns.Add("Value", typeof(int));

    DataRow dr = dt.NewRow();
    dr[0] = "label 1";
    dr[1] = 1;
    dt.Rows.Add(dr);

    DataRow dr2 = dt.NewRow();
    dr2[0] = "label 2";
    dr2[1] = 5;
    dt.Rows.Add(dr2);

    DataRow dr3 = dt.NewRow();
    dr3[0] = "label 3";
    dr3[1] = 7;
    dt.Rows.Add(dr3);

    DataRow dr4 = dt.NewRow();
    dr4[0] = "label 4";
    dr4[1] = 9;
    dt.Rows.Add(dr4);

    DataRow dr5 = dt.NewRow();
    dr5[0] = "label 5";
    dr5[1] = 6;
    dt.Rows.Add(dr5);

    return dt;
}

Hope this helps.


Kind regards,
Manuel
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.