DateTimeContinuousAxis - synchronize ticks with day boundaries

[Lorenzo Sforzini]

Hi,

We're porting the charts in our Silverlight application from the old RadChart to the new RadChartVIew. All our charts will be plain RadCartesianChart's with a datetime x-axis and a linear y-axis, populated with LineSeries.

I found a feature I can't replicate back:
With the old RadChart I could make horizontal ticks fall on natural boundaries of the Axis, i.e. days, months... independent of any Minimum or Maximum values were set on that Axis.
With the new RadCartesianChart, ticks instead start from the Minimum value set on that Axis, with subsequent ticks placed at 1-day distance at the same hour of the day; so, if the Axis has a Minimum value set to i.e. 05/07/2012 12:00, subsequent ticks and lines will be placed at 06/07/2012 12:00h and so on. Since I had a LabelFormat that was only showing the date part, it mislead me, I took hours to realize that it is by design and not an axis/datapoint misalignment bug (by the way, it is a requirement that I show only the date part).

I'm attaching a screenshot with my current RadCartesianChart setup: at the top, with a Minimum value of 01/07/2012 00:00h, and at the bottom with 01/07/2012 12:00h.
I would like the horizontal axis ticks and lines to appear (in the bottom chart) aligned with day boundaries and not with the Minimum value set on the graph.

Is this possible currently?
I already know of Zoom and Pan properties, but they're relative and pixel-based.

thank you

[Nikolay]

Hi Lorenzo,

In case you do not wish the exact hour of the day to be respected and the ticks to be aligned with the data points, then using the DateTimeCategorical axis would be a better choice.

As for using the DateTimeContinuous axis, there are a couple of properties that would allow you to customize how the chart would appear. First of all, the PlotMode property, which is generally set to OnTicks or OnTicksPadded for linear series, however, you may also consider using BetweenTicks. Also, you can set the MajorStepUnit and MajorStep properties :

(this.HorizontalAxis as DateTimeContinuousAxis).MajorStepUnit = TimeInterval.Day;
(this.HorizontalAxis as DateTimeContinuousAxis).MajorStep = 0.5;

In the demonstrated configuration you would have a tick per each 12 hours.

Hope this helps. In case the issue persists, it would be very helpful if you're able to send us a sample application, which demonstrates your scenario and/or the configuration of the DateTime axis and data.

Regards,
Nikolay
the Telerik team

[Lorenzo Sforzini]

Hi

Thanks for you answer.
Unfortunately, the solution you provided doesn't meet my question.

Suppose we take a chart with a horizontal DateTimeContinuousAxis set this way:

• MajorStepUnit=Day
• MajorStep=0.5
• Minimum = 1-Jan-2012 06:00

Ticks in the horizontal axis will appear at:

 

• 1-Jan-12 06:00 (origin of the axis),
• 1-Jan-12 18:00
• 2-Jan-12 06:00
• and so on...

I'd like them to appear centered on day changes, regardless of which Minimum value I set on the axis (or month changes if MajorStepUnit=Month, and so on):

• first tick hidden due to Axis.Minimum excluding it from view
• 1-Jan-12 12:00
• 2-Jan-12 00:00
• 2-Jan-12 12:00
• ...

I hope I've been clear enough now.
Thank you.

[Nikolay]

Hi Lorenzo,

Unfortunately, the scenario you are describing requires having an irregular tick step, which is not supported by RadChartView at the moment. If the axis Minimum is set to 1-Jan-2012 06:00, then all following ticks would be directly dependent on this origin point and the given MajorStep, so it would not be possible to have them at 1-Jan-12 12:00, 2-Jan-12 00:00, etc. It would be possible to skip the first tick by setting the MajorTickOffset to 1, however, the step would still be the same.

Our developers are aware of this limitation and will consider adding such functionality for future versions of the control.

Regards,
Nikolay
the Telerik team

[Meliton Tienda]

Hello. 

I have the same problem but with float numbers that represent a length.

When will it be possible?

Regards...

[Senthil kumar]

Dear Team,
I am facing the same problem in both DataTimeContinuonus & Categorical axis (x-axis) in the Radcartesianchart.
(i am using line series for this chart).

[Peshito]

Hello,

What you could do is setting the MajorStepUnit property of your axis to Hour. Then set the Major step to 12 for example which will mean that the step is 12 hours. This, combined with first having set a Minimum and Maximum properties will produce a first axis tick equal to your Minimum followed by the next tick that equals your Minimum plus 12 hours.
For instance:

RadChart1.HorizontalAxis = new DateTimeContinuousAxis()
{
    LabelFormat = "ddd hh:mm tt",
    Title = "Vertical DateTimeContinuous Axis",
    Minimum = new DateTime(2011, 7, 5, 00, 00, 00),
    Maximum = new DateTime(2011, 7, 9, 00, 00, 00),
    MajorStepUnit = Telerik.Charting.TimeInterval.Hour,
    MajorStep = 12
};

I have also attached a sample illustrating the above approach.

Regards,
Peshito
Telerik

[DrMDodd]

Could you please tell me if I implement the DateTimeContinuousAxis horizontal axis is it possible to orientate the tick label to be at 45 degrees as my current code doesn't permit it:

Telerik.Windows.Controls.RadCartesianChart chart = (Telerik.Windows.Controls.RadCartesianChart)this.FindName("chart1");
            chart.VerticalAxis = new LinearAxis()
            {
                MajorStep = 50,
                Minimum = -1,
                Maximum = 250
            };
            chart.HorizontalAxis = new DateTimeContinuousAxis()
            {
                Title = "Datetime",
                Minimum = DateTime.Now.AddDays(-30),
                Maximum = DateTime.Now,
                LabelFormat = "ddd hh:mm tt",
                LabelRotationAngle = -45,
                MajorStepUnit = Telerik.Charting.TimeInterval.Hour,
                MajorStep = 12
            };

[Peshito]

Hello DrMDodd,

You are doing everything right, except specifying the AxisLabelFitMode. Simply set the AxisLabelFitMode to AxisLabelFitMode.Rotate and you will get your axis labels rotated:

chart.HorizontalAxis = new DateTimeContinuousAxis()
{
    Title = "Datetime",
    Minimum = DateTime.Now.AddDays(-30),
    Maximum = DateTime.Now,
    LabelFormat = "ddd hh:mm tt",
    LabelFitMode = Telerik.Charting.AxisLabelFitMode.Rotate,
    LabelRotationAngle = -45,
    MajorStepUnit = Telerik.Charting.TimeInterval.Hour,
    MajorStep = 12
};

Regards,
Peshito
Telerik