Time Bar binding to contained data

[Eric]

Hello,

I have a sparkline in a time bar, and I am looking to match the x values of the sparkline with the times of the timebar.  Currently, the first item in the sparkline is always shown at the start of the timebar, no matter if the times match or not.  Is there a way I can do this?

Thanks,
Eric

[Rosko]

Hi Eric,

To achieve the desired effect you need to set two properties: timeBar1.PeriodStart and timeBar1.PeriodEnd. For the first one, you have to set the same DateTime which comes in first in the ItemsSource of the SparkLine. For the other one, the last DateTime from the ItemsSource of the SparkLine. If the generic collection is sorted you can do something similar to the one in the code snippet below. I hope this helps.

timeBar1.PeriodStart = list.First().Date;
timeBar1.PeriodEnd = list.Last().Date;

Greetings,

Rosko

the Telerik team

[Eric]

Hello,

What if I wanted to have two sparklines showing, one that occours from 10:00AM to 3:00PM and one from 11:00AM to 2:00PM, and I wanted to have them appear in the correct locations?  Or, for example, I wanted some white space on the side of the sparkline so it's easier to zoom in to the edges of the sparkline.

Thanks,
Eric

[Rosko]

Hello Eric,

All of this can be achieved.

To have two SparkLines which do not start from different places in a TimeBar you need to set these three properties of SparkLine: AutoRange, MinXValue, MaxXValue.

sparkLine2.AutoRange = false;
sparkLine2.MinXValue = timeBar2.PeriodStart.Ticks;
sparkLine2.MaxXValue = timeBar2.PeriodEnd.Ticks;

To have some space on the sides, you need to extend the PeriodStart and PeriodEnd.

timeBar1.PeriodStart = list1.First().Date.AddDays(-0.1);
timeBar1.PeriodEnd = list1.Last().Date.AddDays(0.1);

You can see the attached sample project, where the desired behavior is demonstrated. I hope this meets your requirements.

Regards,

Rosko

the Telerik team