Y-Axis values jumbled up on RadChart with ScaleBreaks

[AJ]

I'm not sure what I'm doing wrong and even though it's rather small issue, it's an annoying one. I'm sure it's an easy fix, but I can't figure it out.

Basically, on my RadChart I'm using scale breaks and where the break actually occurs the numbers on the y-axis get jumbled up/overlap each other, making it difficult to read.

Here's the code on the aspx page:

<telerik:RadChart ID="rcTotalCaseTypes" AutoLayout="true" runat="Server" Width="900px"
           Skin="Telerik" Style="margin: 0px auto;" IntelligentLabelsEnabled="True">
           <Legend Visible="true">
               <Appearance GroupNameFormat="#VALUE">
               </Appearance>
           </Legend>
           <ChartTitle TextBlock-Text="Total Cases by Category">
               <TextBlock>
                   <Appearance TextProperties-Font="Verdana, 20px, style=Bold" TextProperties-Color="#00529B">
                   </Appearance>
               </TextBlock>
           </ChartTitle>
           <PlotArea>
               <Appearance Dimensions-Margins="18%, 22%, 12%, 14%">
               </Appearance>
               <XAxis DataLabelsColumn="PrettyMonthYr">
                   <Appearance>
                       <TextAppearance TextProperties-Font="Verdana, 8pt, style=Bold">
                       </TextAppearance>
                   </Appearance>
               </XAxis>
               <YAxis LabelStep="5" ScaleBreaks-Enabled="true" AutoScale="False">
                   <Appearance ValueFormat="None">
                       <TextAppearance TextProperties-Font="Verdana, 8pt, style=Bold">
                       </TextAppearance>
                       <MajorGridLines Width="3" PenStyle="Dash" />
                       <MinorGridLines Visible="false" />
                   </Appearance>
               </YAxis>
           </PlotArea>
       </telerik:RadChart>

On the code behind (this code is executed on Page_Init):

var data = SPs.RptNumberOfCasesByType(locationID).ExecuteTypedList<InvoiceCategoryNumbers>();
ChartMonths = new List<DateTime>();

var primaryKnee = new ChartSeries
{
    Name = "PK Cases",
    Type = ChartSeriesType.Bar,
    YAxisType = ChartYAxisType.Primary
};

var revisionKnee = new ChartSeries
{
    Name = "RK Cases",
    Type = ChartSeriesType.Bar,
    YAxisType = ChartYAxisType.Primary
};

var hipCases = new ChartSeries
{
    Name = "Hip Cases",
    Type = ChartSeriesType.Bar,
    YAxisType = ChartYAxisType.Primary
};

var rxCases = new ChartSeries
{
    Name = "Rx Cases",
    Type = ChartSeriesType.Bar,
    YAxisType = ChartYAxisType.Primary
};

var otherCases = new ChartSeries
{
    Name = "Other Cases",
    Type = ChartSeriesType.Bar,
    YAxisType = ChartYAxisType.Primary
};


data.ForEach(c =>
                {
                    ChartMonths.Add(Convert.ToDateTime(c.YearMo + "-01"));

                    var barTooltip = string.Format("<b>{0}</b><br /># of Cases: {1}<br />Total Sales: {2:C}", c.Category, c.NumInvoices, c.TotalSold);
                    var barSeriesItem = new ChartSeriesItem(Convert.ToDouble(c.NumInvoices), c.Category) { Name = c.Category };
                    barSeriesItem.Label.Visible = false;
                    barSeriesItem.Label.ActiveRegion.Tooltip = barTooltip;
                    barSeriesItem.ActiveRegion.Tooltip = barTooltip;


                    switch (c.InvoiceCategoryID)
                    {
                        case -1:
                            otherCases.AddItem(barSeriesItem);
                            break;
                        case 1:
                            primaryKnee.AddItem(barSeriesItem);
                            break;
                        case 2:
                            revisionKnee.AddItem(barSeriesItem);
                            break;
                        case 3:
                            hipCases.AddItem(barSeriesItem);
                            break;
                        case 11:
                            rxCases.AddItem(barSeriesItem);
                            break;
                    }
                });
rcTotalCaseTypes.Series.Add(primaryKnee);
rcTotalCaseTypes.Series.Add(revisionKnee);
rcTotalCaseTypes.Series.Add(hipCases);
rcTotalCaseTypes.Series.Add(rxCases);
rcTotalCaseTypes.Series.Add(otherCases);
rcTotalCaseTypes.DataBind();

rcTotalCaseTypes.PlotArea.XAxis.Clear();
if (ChartMonths.Count > 0)
{
    var uniqueMonths = new HashSet<DateTime>(ChartMonths);
    uniqueMonths.ToList().ForEach(m => rcTotalCaseTypes.PlotArea.XAxis.AddItem(m.ToString("MM/yyyy")));
}

rcTotalCaseTypes.PlotArea.YAxis.ScaleBreaks.Segments.Add(new AxisSegment() { MinValue = 0, MaxValue = 150, Step = 10 });
rcTotalCaseTypes.PlotArea.YAxis.ScaleBreaks.Segments.Add(new AxisSegment() { MinValue = 151, MaxValue = 500, Step = 10 });

I'd prefer not to have to manually create segments, but if I have to I will. 

Thank you for your help!

[Peshito]

Hello,

I tried to reproduce your issue following a scenario similar to yours and I could not. The labels overlapping most probably appears because of the values your series items have. Try changing your first scale break's MaxValue and your second scale break's MinValue. You might also have to change the Step value of your second scale break in order to better display the labels.

I have attached a sample that you could refer to for more information. If the above approach does not help, could you try to reproduce your issue using the attached example, as it is not clear from your code provided what data have you used for your series.

All the best,
Peshito
the Telerik team