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

RadChart not drawing all points, or

3 Answers 66 Views
Chart
This is a migrated thread and some comments may be shown as answers.
Jeroen
Top achievements
Rank 1
Jeroen asked on 19 Apr 2012, 03:40 PM
I've got a RadChart with datetime values on the X axis (defined as double, converted with ToOADate), and doubles on the Y axis.

<telerik:RadChart telerik:StyleManager.Theme="Expression_Dark"
                                              HorizontalAlignment="Left"
                                              Name="ChartJam"
                                              VerticalAlignment="Stretch"
                                              PaletteBrushesUseSolidColors="True"
                                              Loaded="ChartJam_Loaded"
                                                   Height="Auto" MinHeight="100"
                                                   Width="Auto" MinWidth="200"
                                          Margin="0" BorderThickness="0"
                                                   Cursor="Hand">
                        <telerik:RadChart.DefaultView>
                            <telerik:ChartDefaultView>
                                <telerik:ChartDefaultView.ChartArea>
                                    <telerik:ChartArea EnableAnimations="False" x:Name="MyChartArea"
                                                               ItemToolTipOpening="ChartArea_ItemToolTipOpening">
                                        <telerik:ChartArea.AxisY >
                                            <telerik:AxisY Title="" AutoRange="True"
                                                               StripLinesVisibility="Visible" MajorGridLinesVisibility="Visible">
                                            </telerik:AxisY>
                                        </telerik:ChartArea.AxisY>
                                        <telerik:ChartArea.Annotations>
                                        </telerik:ChartArea.Annotations>
                                        <telerik:ChartArea.AxisX>
                                            <telerik:AxisX IsDateTime="True"
                                                               MajorGridLinesVisibility="Visible" MinorGridLinesVisibility="Visible"
                                                               Title=""
                                                               LabelRotationAngle="45"
                                                               DefaultLabelFormat="HH:mm"
                                                               AutoRange="True"
                                                               LabelStep="1"
                                                               TicksDistance="20">                                                              
                                            </telerik:AxisX>
                                        </telerik:ChartArea.AxisX>
                                    </telerik:ChartArea>
                                </telerik:ChartDefaultView.ChartArea>                               
                            </telerik:ChartDefaultView>
                        </telerik:RadChart.DefaultView>
                    </telerik:RadChart>

In the ChartJam_Loaded I then define my chart:

ChartJam.DefaultView.ChartArea.AxisX.AxisStyles.ItemLabelStyle = App.Current.Resources["ChartLabel"] as Style;           
            ChartJam.DefaultView.ChartArea.AxisY.AxisStyles.ItemLabelStyle = App.Current.Resources["ChartLabel"] as Style;
 
            ChartJam.DefaultView.ChartArea.Annotations.Clear();
            ChartJam.DefaultView.ChartArea.EnableAnimations = false;
 
            ChartJam.DefaultView.ChartLegend.Visibility = System.Windows.Visibility.Collapsed;
            ChartJam.DefaultSeriesDefinition = new AreaSeriesDefinition()
            {
                Appearance = new SeriesAppearanceSettings()
                {
                    Stroke = Utilities.StringToSolidColorBrush("93D427"),
                    StrokeThickness = 1.0,
                    Fill = new SolidColorBrush(Colors.Black)
                },
                ShowPointMarks = false,
                ShowItemLabels = false,
                ShowItemToolTips = true
            };
 
            SeriesMapping seriesMapping = new SeriesMapping();
            seriesMapping.ItemMappings.Add(new ItemMapping("JamLength", DataPointMember.YValue));
            seriesMapping.ItemMappings.Add(new ItemMapping("DtJamLength", DataPointMember.XValue));
 
            ChartJam.SeriesMappings.Add(seriesMapping);
 
            ChartJam.ItemsSource = _chartsJamGuardVM.LineData;
             
            _chartsJamGuardVM.DownloadChartJam();

The ViewModel then downloads the data and builds the LineData list with objects of the following class:

public class JamLengthData : ViewModelBase
    {
        private double _dtJamLength;
        public double DtJamLength { get { return _dtJamLength; } set { _dtJamLength = value; RaisePropertyChanged("DtJamLength"); } }
        private double _jamLength;
        public double JamLength { get { return _jamLength; } set { _jamLength = value; RaisePropertyChanged("JamLength"); } }
 
        public JamLengthData(double dtJamLength, double jamLength)
        {
            this.DtJamLength = dtJamLength;
            this.JamLength = (double) jamLength / 1000.0;
        }
 
        public JamLengthData() { }
    }




Now, the problem. I know that the highest Y value in the entire range data which spans about a day, is 15966, at 19h16.
When I limit the data to a range of 3 hours (which corresponds to 180 points since I've got data for every minute), the chart looks ok. The peak Y value is displayed correctly at +/- 16000.

However, if I draw a larger period, say spanning 10 hours from 13h00 to 23h00 (561 points for this period in the database), it looks like all the points in the chart are very loosely drawn and only "approaching" the actual values in the collection. Where the peak is supposed to be, the actual point drawn is around 14400 (not even close!). Even worse, I can see several other peaks in the chart that are drawn HIGHER than the highest point in my collection.

What's going on here?

3 Answers, 1 is accepted

Sort by
0
Jeroen
Top achievements
Rank 1
answered on 19 Apr 2012, 04:36 PM
It's apparently caused by the amount of points. If I have a collection of 1000 points, the chart is drawn incorrectly. If I reduce the amount of points (e.g. I only draw the highest point of every group of 5 points), the chart looks fine.

How is it possible that this chart is unable to handle 1000 points?
0
Accepted
Ves
Telerik team
answered on 24 Apr 2012, 12:42 PM
Hi Jeroen,

The reason for this behavior is in a feature called Sampling. Please, find the details in the following help topic:

http://www.telerik.com/help/silverlight/radchart-features-sampling.html

Best regards,
Ves
the Telerik team

Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>

0
Jeroen
Top achievements
Rank 1
answered on 18 May 2012, 02:05 PM
Hey Ves,

Thanks for the pointer. It's working now the way I need it to (using a Max SamplingFunction), but it took me some struggling.

The documentation says: "When binding without series mappings, the value of the RadChart.SamplingSettings.SamplingFunction determines the pattern. When binding with series mappings, the value of the pattern is determined by the value of the ItemMapping.SamplingFunction. " 

Looking at it now it makes perfect sense, but it wasn't immediately clear to me what that meant. I'd suggest maybe adding some sample code to the documentation for setting the SamplingFunction when using binding with series mappings. Every example code I've found always uses the other implementation. I found it very confusing having to set the threshold on the RadChart object, but having to define the used sampling function in the item mapping.

Anyway, for future reference, this bit of code made the sampling work correctly for me:

ItemMapping itemMapping = new ItemMapping("JamLength", DataPointMember.YValue);
itemMapping.SamplingFunction = ChartSamplingFunction.Max;

ChartJam.SamplingSettings.SamplingThreshold = 100;
Tags
Chart
Asked by
Jeroen
Top achievements
Rank 1
Answers by
Jeroen
Top achievements
Rank 1
Ves
Telerik team
Share this question
or