MajorTickInterval and CategoricalAxis

8 posts, 0 answers
  1. Valery
    Valery avatar
    53 posts
    Member since:
    May 2011

    Posted 21 May 2018 Link to this post

    I create a BarSeries where the category is the sequence of integers 1, 2, 3, ...

    then I change

    MajorTickInterval = 10;

    tick labels are drawn as 12 22 32 ...

    Why not 10, 20, 30 ...?

  2. Dimitar
    Admin
    Dimitar avatar
    2820 posts

    Posted 22 May 2018 Link to this post

    Hi Valery,

    This will depend on the first category added to the chart. If the first category is 0 you will get the desired results. 

    In general, you can consider using scatter line or scatter area series for a chart where you have numeric values for both axes. This way you will be able to set the minimum and maximum of the horizontal axis.

    I hope this will be useful. Let me know if you have additional questions. 

    Regards,
    Dimitar
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. Valery
    Valery avatar
    53 posts
    Member since:
    May 2011

    Posted 22 May 2018 in reply to Dimitar Link to this post

    Your answer does not suit me.

    Well, if the category begins with 0, we obtain 10, 20, ....

    Why, if the category begins with 1, we obtain 12, 22, 32...? It must then be 11, 21, 31 ... Or alternatively 15, 25, 35

  4. Dimitar
    Admin
    Dimitar avatar
    2820 posts

    Posted 22 May 2018 Link to this post

    Hello Valery,

    I have further investigated this and even when the axis starts from the top the labels are calculated from bottom to top, so the points count will matter as well. 

    It is possible to format the labels text in any way and in this case you can round the numbers. Here is the code:
    public partial class RadForm1 : Telerik.WinControls.UI.RadForm
    {
        Random rnd = new Random();
     
        public RadForm1()
        {
            InitializeComponent();
            BarSeries barSeries = new BarSeries("Performance", "RepresentativeName");
            barSeries.Name = "Q1";
     
            for (int i = 0; i < 100; i++)
            {
                barSeries.DataPoints.Add(new CategoricalDataPoint(rnd.Next(), i));
     
            }
     
            this.radChartView1.Series.Add(barSeries);
     
            CategoricalAxis horizontalAxis = barSeries.HorizontalAxis as CategoricalAxis;
            horizontalAxis.MajorTickInterval = 10;
            horizontalAxis.IsInverse = true;
            horizontalAxis.LabelFormatProvider = new MyFormatProvider();
            ((CartesianArea)radChartView1.Area).Orientation = Orientation.Horizontal;
        }
    }
    public class MyFormatProvider : IFormatProvider, ICustomFormatter
    {
        public object GetFormat(Type formatType)
        {
            return this;
        }
     
        public string Format(string format, object arg, IFormatProvider formatProvider)
        {
            int number = int.Parse(arg.ToString());
            return (((int)(number / 10)) * 10).ToString();
           
        }
    }

    Let me know how this works for you.

    Regards,
    Dimitar
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  5. Valery
    Valery avatar
    53 posts
    Member since:
    May 2011

    Posted 22 May 2018 in reply to Dimitar Link to this post

    The problem is also that the label is drawn in the wrong place (see image - zoomed in paint). I use two series (red and blue) with the same categories.

    The label 12 is in the place where the category 7 is located and so on

  6. Dimitar
    Admin
    Dimitar avatar
    2820 posts

    Posted 23 May 2018 Link to this post

    Hi Valery,

    You can set the PlotMode like this:
    horizontalAxis.PlotMode = AxisPlotMode.OnTicks;

    Please note that the categorical axis is not meant for such use, it usually contains categories that are not consecutive and do not require exact rendering (like names, product, e.t.c).

    I hope this will be useful. 

    Regards,
    Dimitar
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  7. Valery
    Valery avatar
    53 posts
    Member since:
    May 2011

    Posted 23 May 2018 in reply to Dimitar Link to this post

    if I use

    PlotMode = AxisPlotMode.OnTicks;

    results are more adequate, but only if I do not use the vertical axis inversion (label starts from 1).

    If I write for the vertical axis  (the same data)

    IsInverse = true;

    label starts from 3. It is not right. How to make it start with 1?

     

  8. Dimitar
    Admin
    Dimitar avatar
    2820 posts

    Posted 23 May 2018 Link to this post

    Hello Valery,

    Currently, the ticks are calculated from the bottom to top (inverse or not) and this is why there is a difference. In your case, the last point is 163 and the tics are starting from there. Unfortunately, the logic for this is located in an internal class and there is no way to access it. This is why I have logged this in our Feedback Portal. You can track its progress, subscribe to status changes and add your comment to it here. I have also updated your Telerik Points.

    For a workaround, I can suggest adding some empty points so the total number is consistent with the tick interval (for example 170).

    Should you have any other questions do not hesitate to ask.

    Regards,
    Dimitar
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top