This question is locked. New answers and comments are not allowed.
I have a bar chart with a data set which may vary from small to very large. When viewing large data sets the bar widths are large and overlap each other, creating a very odd looking chart. Below is code to reproduce the problem with attached image of the result. Zooming in merely scales the bars and only looks worse. I have attached an image of what I would expect it to look like, which I achieved by zooming in first before setting the itemssource, then zooming out again.
I also have an issue with the label spacing. I know I can use the LabelInterval however due to the fact my data set can vary greatly (anywhere from 1 - 40000 points) it is near impossible to determine a suitable interval. Using one of the fit mode's is also useless as overlap will still occur using rotation, and multiline takes too much space.
MainPage.xaml
MainPage.xaml.cs
I also have an issue with the label spacing. I know I can use the LabelInterval however due to the fact my data set can vary greatly (anywhere from 1 - 40000 points) it is near impossible to determine a suitable interval. Using one of the fit mode's is also useless as overlap will still occur using rotation, and multiline takes too much space.
MainPage.xaml
<
Grid
>
<
Grid.RowDefinitions
>
<
RowDefinition
Height
=
"Auto"
/>
<
RowDefinition
Height
=
"*"
/>
</
Grid.RowDefinitions
>
<
StackPanel
Grid.Row
=
"0"
Orientation
=
"Horizontal"
Margin
=
"5"
>
<
telerik:RadDateTimePicker
x:Name
=
"FromDate"
SelectionChanged
=
"UpdateChart"
Width
=
"150"
/>
<
telerik:RadDateTimePicker
x:Name
=
"ToDate"
SelectionChanged
=
"UpdateChart"
Width
=
"150"
Margin
=
"5,0,0,0"
/>
</
StackPanel
>
<
telerik:RadCartesianChart
x:Name
=
"Chart"
Grid.Row
=
"1"
>
<
telerik:RadCartesianChart.HorizontalAxis
>
<
telerik:DateTimeContinuousAxis
/>
</
telerik:RadCartesianChart.HorizontalAxis
>
<
telerik:RadCartesianChart.VerticalAxis
>
<
telerik:LinearAxis
/>
</
telerik:RadCartesianChart.VerticalAxis
>
<
telerik:RadCartesianChart.Behaviors
>
<
telerik:ChartPanAndZoomBehavior
ZoomMode
=
"Horizontal"
PanMode
=
"Horizontal"
/>
</
telerik:RadCartesianChart.Behaviors
>
<
telerik:RadCartesianChart.Series
>
<
telerik:BarSeries
CategoryBinding
=
"Timestamp"
ValueBinding
=
"Value"
/>
</
telerik:RadCartesianChart.Series
>
</
telerik:RadCartesianChart
>
</
Grid
>
MainPage.xaml.cs
public
class
Data
{
public
DateTime Timestamp {
get
;
set
; }
public
int
Value {
get
;
set
; }
}
public
partial
class
MainPage : UserControl
{
private
Random _rand =
new
Random();
public
MainPage()
{
InitializeComponent();
FromDate.SelectedDate = DateTime.Today.AddYears(-1);
ToDate.SelectedDate = DateTime.Today;
}
private
void
UpdateChart(
object
sender, EventArgs e)
{
Chart.Series[0].ItemsSource = GenerateData();
}
private
IEnumerable<Data> GenerateData()
{
DateTime from = FromDate.SelectedDate ?? DateTime.Today.AddYears(-1);
DateTime to = ToDate.SelectedDate ?? DateTime.Today;
for
(; from < to; from = from.AddDays(1))
{
yield
return
new
Data()
{
Timestamp = from,
Value = _rand.Next(400, 450)
};
}
}
}