We have a TimeBar that is used to show corresponding data in RadChart.
There is a LinearSparkLine being used inside the TimeBar. And this SparkLine seems to spread across the TimeBar for the selected dates even when there is no data for particular times in the.
In the attached screenshots, the Bindings have data only from 8PM of 31st October 2015, but the SparkLine seems to show data even for that time Interval.
I tried setting the Min and Max XValue of the SparkLine, and that also did not do workout.
Is there any way to set the SparkLine to show data only within particular intervals of the TimeBar?
I'm not sure if this is possible, but a user asked me if there is some way we can create a "bubble" popup on the timebar that would popup on the timebar...maybeat the top or bottom, when the user is sliding the timebars. I've already created labels that are bound to the ActualSelectionStart and ActualSelectionEnd that update in real time, but they are located in a top corner of the application and remain in one static place. The user wants a popup bubble to appear when they are dragging the timebars left or right that shows the exact/actual time selected, then disappear when the user lets go of the timebar. Is this possible? Like I said I already have the label that does this, but it doesn't show/hide based on the timebar being "grabbed", and it doesn't move with the timebar.
Thanks!
private
void
YearTimeBar_HoveredPeriodChanged(
object
sender, Telerik.Windows.Controls.TimeBar.HoveredPeriodEventArgs e)
{
if
(e.HoveredPeriodRange !=
null
)
{
DisplaySelectionStartDate = e.HoveredPeriodRange.Value.Start.ToString(
"dd-MMM-yyyy"
);
DisplaySelectionEndDate = e.HoveredPeriodRange.Value.End.ToString(
"dd-MMM-yyyy"
);
}
}
private
void
YearTimeBar_MouseMove(
object
sender, System.Windows.Input.MouseEventArgs e)
{
DisplaySelectionStartDate = ((Telerik.Windows.Controls.RadTimeBar)sender).ActualSelectionStart.ToString(
"dd-MMM-yyyy"
);
DisplaySelectionEndDate = ((Telerik.Windows.Controls.RadTimeBar)sender).ActualSelectionEnd.ToString(
"dd-MMM-yyyy"
);
}
<
Grid
x:Name
=
"LayoutRoot"
Background
=
"White"
>
<
telerik:RadTimeBar
Name
=
"timeBar1"
Grid.Row
=
"1"
Width
=
"1200"
Height
=
"200"
PeriodStart
=
"2011-01-01"
PeriodEnd
=
"2011-01-03" <!-- please change to one day -->
IsSnapToIntervalEnabled
=
"True"
>
<
telerik:RadTimeBar.Intervals
>
<
telerik:HourInterval
/>
<
telerik:DayInterval
/>
</
telerik:RadTimeBar.Intervals
>
<
Grid
Margin
=
"0,10,0, 10"
>
<
telerik:RadChart
ItemsSource
=
"{Binding Items}"
>
<
telerik:RadChart.DefaultView
>
<
telerik:ChartDefaultView
>
<
telerik:ChartDefaultView.ChartLegend
>
<
telerik:ChartLegend
Visibility
=
"Collapsed"
></
telerik:ChartLegend
>
</
telerik:ChartDefaultView.ChartLegend
>
<
telerik:ChartDefaultView.ChartArea
>
<
telerik:ChartArea
Margin
=
"0 0 0 0"
Padding
=
"0 0 0 0"
>
<
telerik:ChartArea.AxisY
>
<
telerik:AxisY
Visibility
=
"Collapsed"
/>
</
telerik:ChartArea.AxisY
>
<
telerik:ChartArea.AxisX
>
<
telerik:AxisX
DefaultLabelFormat
=
"hh"
/>
</
telerik:ChartArea.AxisX
>
</
telerik:ChartArea
>
</
telerik:ChartDefaultView.ChartArea
>
</
telerik:ChartDefaultView
>
</
telerik:RadChart.DefaultView
>
<
telerik:RadChart.SeriesMappings
>
<
telerik:SeriesMapping
>
<
telerik:SeriesMapping.SeriesDefinition
>
<
telerik:BarSeriesDefinition
/>
</
telerik:SeriesMapping.SeriesDefinition
>
<
telerik:SeriesMapping.ItemMappings
>
<
telerik:ItemMapping
FieldName
=
"DateTimeStamp"
DataPointMember
=
"XValue"
/>
<
telerik:ItemMapping
FieldName
=
"Data"
DataPointMember
=
"YValue"
/>
</
telerik:SeriesMapping.ItemMappings
>
</
telerik:SeriesMapping
>
</
telerik:RadChart.SeriesMappings
>
</
telerik:RadChart
>
</
Grid
>
</
telerik:RadTimeBar
>
</
Grid
>
namespace timebar
{
public partial class MainPage : UserControl
{
public MainPage()
{
this.DataContext = this;
InitializeComponent();
}
public List<
Item
> Items
{
get
{
List<
Item
> items = new List<
Item
>();
Random r = new Random();
for (DateTime date = timeBar1.PeriodStart; date < timeBar1.PeriodEnd; date = date.AddHours(1))
{
items.Add(new Item() { Data = r.Next(10, 100), DateTimeStamp = date });
}
return items;
}
}
}
public class Item
{
public int Data
{
get;
set;
}
public DateTime DateTimeStamp
{
get;
set;
}
}
}
<
telerik:RadTimeBar
Height
=
"100"
VerticalAlignment
=
"Top"
Margin
=
"6"
IsSnapToIntervalEnabled
=
"True"
EnableSparklineVirtualization
=
"False"
PeriodStart
=
"{Binding PeriodStart}"
PeriodEnd
=
"{Binding PeriodEnd}"
SelectionStart
=
"{Binding SelectionStart,Mode=TwoWay}"
SelectionEnd
=
"{Binding SelectionEnd, Mode=TwoWay}"
>
<
telerik:RadTimeBar.Intervals
>
<
telerik:YearInterval
/>
<
telerik:MonthInterval
/>
<
telerik:WeekInterval
/>
<
telerik:DayInterval
/>
</
telerik:RadTimeBar.Intervals
>
<
telerik:RadColumnSparkline
ItemFill
=
"#FFD6D4D4"
ItemsSource
=
"{Binding ColumnDataList}"
XValuePath
=
"DatePoint"
YValuePath
=
"Value"
ColumnWidthPercent
=
".8"
/>
</
telerik:RadTimeBar
>