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

MajorTickInterval and CategoricalAxis

7 Answers 240 Views
ChartView
This is a migrated thread and some comments may be shown as answers.
Valery
Top achievements
Rank 1
Veteran
Valery asked on 21 May 2018, 12:23 PM

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 ...?

7 Answers, 1 is accepted

Sort by
0
Dimitar
Telerik team
answered on 22 May 2018, 05:56 AM
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.
0
Valery
Top achievements
Rank 1
Veteran
answered on 22 May 2018, 06:57 AM

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

0
Dimitar
Telerik team
answered on 22 May 2018, 08:25 AM
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 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.
0
Valery
Top achievements
Rank 1
Veteran
answered on 22 May 2018, 11:03 AM

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

0
Dimitar
Telerik team
answered on 23 May 2018, 07:56 AM
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.
0
Valery
Top achievements
Rank 1
Veteran
answered on 23 May 2018, 08:32 AM

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?

 

0
Dimitar
Telerik team
answered on 23 May 2018, 11:21 AM
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.
Tags
ChartView
Asked by
Valery
Top achievements
Rank 1
Veteran
Answers by
Dimitar
Telerik team
Valery
Top achievements
Rank 1
Veteran
Share this question
or