Long text labels and plot area width

2 posts, 0 answers
  1. Chris
    Chris avatar
    1 posts
    Member since:
    Feb 2012

    Posted 16 Feb 2012 Link to this post

    I have a stacked bar chart bound to dynamic data. 

    The initial issue was numeric labels overlapping along the X-axis.  I solved this by taking the chartarea width and fudging an equation to adjust my axis step value.

    radChart.DefaultView.ChartArea.AxisY.Step = M

    ath.Round((_maxvalue / (_width / 35)) + .499999, 0);

    This works for most cases, but the problem is when there is a large label on the Y axis, my _width is the size of the chart area and not the actual width of the plot area.  Is there a way get the plot area width?  Or perhaps a simpler way to stop label stompage?

    [-----------------width-------------------------------]     <--- width of the chart area
    Label 1                                         | PLOT
    Long Label Eating my Plot Area   |  AREA
                                                         [-------------]     <--- actual width available for my X axis labels.

    Right now I'm looping over the Y axis tick labels to guestimate the width of the Y axis label area.


    _maxXAxisLabelLength = 0;

    for (int i = 0; i < radChart.DefaultView.ChartArea.AxisX.TickPoints.Count; i++)


    int nLabelLength = radChart.DefaultView.ChartArea.AxisX.TickPoints[i].Label.Length;

    if (nLabelLength > _maxXAxisLabelLength)

    _maxXAxisLabelLength = nLabelLength;


    double estPlotAreaWidth = _width - (_maxXAxisLabelLength * 8);



  2. Giuseppe
    Giuseppe avatar
    2363 posts

    Posted 21 Feb 2012 Link to this post

    Hello Chris,

    You can get the plotarea width from the chart internal ClipPanel that wraps it like this (there is no alternative public plotarea API):
    public partial class MainPage : UserControl
        public MainPage()
            RadChart1.DataBound += new System.EventHandler<ChartDataBoundEventArgs>(RadChart1_DataBound);
            RadChart1.ItemsSource = new[] { 1, 2, 3, 4 };
        void RadChart1_DataBound(object sender, ChartDataBoundEventArgs e)
            Dispatcher.BeginInvoke(() =>
                    // get plotArea ActualWidth from this panel
                    var plotAreaPanel = RadChart1.ChildrenOfType<ClipPanel>().FirstOrDefault();

    Also, you can check this online example here that demonstrates several approaches for handling overlapping axis labels:
    • Visualizing axis labels on different levels.
    • Rotating the axis labels.
    • Setting axis label step.

    Hope this helps.

    the Telerik team
    Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>
Back to Top