Chart Flickering, Horizontal Zoom/Scroll problem/bug

11 posts, 0 answers
  1. Rob Peters
    Rob Peters avatar
    16 posts
    Member since:
    Feb 2010

    Posted 24 Apr 2010 Link to this post

    Hello Telerik,

    I have a few problems with the chart.
    Attached NO example. (!! we are unable to attach zip files)

    Flickering:
    When i set the 'DefaultView.ChartArea.AxisY.AutoRange' to TRUE, the chart flickers,
    when set it to FALSE and specify the min/max/step value it does not have this problem,
    but .... i would like to use the AutoRange function :)

    Horizontal scroll/zoom:
    - I cannot get this working, i think when setting the min/max values for the X axis, everything is reset?
      Is there a solution for this behavior?
    - When i start the application and press ALT-F4 (to close the application), it works,
      when i first try to scroll/zoom the horizontal bar (or clicking on the slider), i cannot press ALT-F4 again, or any other common keyboard shortcuts.

    With kind regards,
    Rob

    As we are unable to attach ZIP files, here the .cs code for the window (it only has one radchart)

    Window.xaml
    <Window x:Class="TelerikChart.Window1" 
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
        xmlns:telerikChart="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Charting" 
        Title="Window1" Height="600" Width="800" 
        Loaded="OnLoaded" 
            > 
        <Grid> 
            <Grid.Resources> 
                <Style x:Key="ItemLabelStyle" TargetType="TextBlock"
                    <Setter Property="Foreground" Value="Orange" /> 
                </Style> 
            </Grid.Resources> 
            <telerikChart:RadChart x:Name="RadChart1" /> 
        </Grid> 
    </Window> 
     


    Window.xaml.cs
    using System; 
    using System.Collections.Generic; 
    using System.Linq; 
    using System.Text; 
    using System.Windows; 
    using System.Windows.Controls; 
    using System.Windows.Data; 
    using System.Windows.Documents; 
    using System.Windows.Input; 
    using System.Windows.Media; 
    using System.Windows.Media.Imaging; 
    using System.Windows.Navigation; 
    using System.Windows.Shapes; 
    using Telerik.Windows.Controls.Charting; 
    using System.Windows.Threading; 
     
    namespace TelerikChart 
        /// <summary> 
        /// Interaction logic for Window1.xaml 
        /// </summary> 
        public partial class Window1 : Window 
        { 
            private DateTime nowTime = new DateTime(DateTime.Now.Year, DateTime.Now.Month, DateTime.Now.Day, DateTime.Now.Hour, DateTime.Now.Minute, DateTime.Now.Second); 
     
            private const int queueCapacity = 3600; 
            private RadHierarchicalObservableCollection<ValueLoadInfo> ChartData = new RadHierarchicalObservableCollection<ValueLoadInfo>(); 
            private Random rnd = new Random(); 
            private DispatcherTimer timer1 = null
     
            public Window1() 
            { 
                InitializeComponent(); 
     
                //Setup Chart 
                RadChart1.DefaultView.ChartTitle.Content = "Legend Title"
                RadChart1.DefaultView.ChartArea.NoDataString = "Waiting for data..."
                RadChart1.DefaultView.ChartArea.EnableAnimations = false
     
                //Setup X-As 
                RadChart1.DefaultView.ChartArea.AxisX.DefaultLabelFormat = "#VAL{HH:mm:ss}"
                RadChart1.DefaultView.ChartArea.AxisX.LabelRotationAngle = 90; 
                RadChart1.DefaultView.ChartArea.AxisX.LabelStep = 2; 
                RadChart1.DefaultView.ChartArea.AxisX.Title = "Time"
                RadChart1.DefaultView.ChartArea.AxisX.LayoutMode = AxisLayoutMode.Normal; 
                RadChart1.DefaultView.ChartArea.AxisX.AutoRange = false
     
                //Setup Y-As 
                RadChart1.DefaultView.ChartArea.AxisY.AutoRange = false
                RadChart1.DefaultView.ChartArea.AxisY.MinValue = 38000; 
                RadChart1.DefaultView.ChartArea.AxisY.MaxValue = 38001; 
                RadChart1.DefaultView.ChartArea.AxisY.Step = 0.100; 
                RadChart1.DefaultView.ChartArea.AxisY.AxisName = "Value"
                RadChart1.DefaultView.ChartArea.AxisY.DefaultLabelFormat = "#VAL{0.000}"
                RadChart1.DefaultView.ChartArea.AxisY.Title = "Value (double)"
     
                //Setup mapping 
                SeriesMapping memoryDataMapping = new SeriesMapping(); 
                memoryDataMapping.LegendLabel = "My Label"
                memoryDataMapping.SeriesDefinition = new LineSeriesDefinition(); 
                (memoryDataMapping.SeriesDefinition as LineSeriesDefinition).ShowPointMarks = false
                (memoryDataMapping.SeriesDefinition as LineSeriesDefinition).ShowItemLabels = false
                memoryDataMapping.SeriesDefinition.AxisName = "Value"
                memoryDataMapping.ItemMappings.Add(new ItemMapping("Time", DataPointMember.XValue)); 
                memoryDataMapping.ItemMappings.Add(new ItemMapping("Value", DataPointMember.YValue)); 
                RadChart1.SeriesMappings.Add(memoryDataMapping); 
     
                //Could not find Resource 'ItemLabelStyle' 
                 
                RadChart1.DefaultView.ChartArea.ZoomScrollSettingsX.ScrollMode = ScrollMode.ScrollAndZoom; 
     
                //RadChart1.DefaultView.ChartLegend.Visibility = Visibility.Collapsed;  
             
            } 
     
            private void OnLoaded(object sender, RoutedEventArgs e) 
            { 
                //Start timer 
                timer1 = new DispatcherTimer(); 
                timer1.Interval = TimeSpan.FromMilliseconds(300); 
                timer1.Tick += timer1_Tick; 
                timer1.Start(); 
            } 
     
            private void SetUpAxisXRange(DateTime now) 
            { 
                if (this.ChartData.Count() > 0) 
                { 
                    RadChart1.DefaultView.ChartArea.AxisX.MinValue = ChartData[0].Time.ToOADate(); 
                    RadChart1.DefaultView.ChartArea.AxisX.MaxValue = now.ToOADate(); 
     
                    double Range = RadChart1.DefaultView.ChartArea.AxisX.MaxValue - RadChart1.DefaultView.ChartArea.AxisX.MinValue; 
                    RadChart1.DefaultView.ChartArea.AxisX.Step = Range / 10.0; 
                } 
            } 
     
            private void timer1_Tick(object sender, EventArgs e) 
            { 
                if (this.ChartData.Count >= queueCapacity) 
                    this.ChartData.RemoveAt(0); 
     
                this.nowTime = this.nowTime.AddMilliseconds(300); 
     
                ValueLoadInfo systemInfo = new ValueLoadInfo(); 
     
                systemInfo.Value = 38000 + (rnd.NextDouble()%1000); 
                systemInfo.Time = this.nowTime; 
                this.ChartData.Add(systemInfo); 
     
                this.SetUpAxisXRange(this.nowTime); 
     
                if (RadChart1.ItemsSource == null
                    RadChart1.ItemsSource = this.ChartData; 
            } 
        } 
        public class ValueLoadInfo 
        { 
            private DateTime _time; 
            private double _Value; 
            public DateTime Time 
            { 
                get { return this._time; } 
                set { this._time = value; } 
            } 
            public double Value 
            { 
                get { return this._Value; } 
                set { this._Value = value; } 
            } 
        } 
     
     

  2. Rob Peters
    Rob Peters avatar
    16 posts
    Member since:
    Feb 2010

    Posted 24 Apr 2010 Link to this post

    Please note, there are two other problems with the chart/source:

    - It plots one too item less !, this behavior i do not have when setting the ItemsSource over and over again, and using a Queue instead of a ObservableCollection.

    - When setting the ItemsSource in the OnLoaded function, and there are no items added to the 'RadHierarchicalObservableCollection', there is an execption.

    At the end of OnLoaded:
    RadChart1.ItemsSource = ChartData

  3. UI for WPF is Visual Studio 2017 Ready
  4. Ves
    Admin
    Ves avatar
    2879 posts

    Posted 28 Apr 2010 Link to this post

    Hi Rob Peters,

    It seems you are using an older version of RadControls for Silverlight. Most of your questions/issues have been addressed in the latest version -- 2010 Q1 SP1, released last week. Please, find attached a small example, implemented with the trial version of RadChart, where
    • Flickering is not observed
    • Horizontal zoom/scroll works as expected
    • RadChart.ItemsSource is assigned in OnLoaded, no exception is thrown even if the source is still empty.
    • Plotting one item less is fixed by moving the line for setting the X axis up before the line, which updates the chart source.
    Onto the last question:
    • This example does not seem to capture the keyboard and I am able to close it using ALT-F4 even after zooming - both by dragging or using the slider. Does this happen with this example at your end?
    Finally, whenever you feel that adding a project would help you to describe better any issue, please feel free to open a formal support ticket, you will be able to attach .zip files to it.

    Sincerely,
    Ves
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
  5. Rob Peters
    Rob Peters avatar
    16 posts
    Member since:
    Feb 2010

    Posted 07 May 2010 Link to this post

    Hello Ves,

    Thank you for the explanation and sample.

    If i turn On the Auto Scaling of the Y-ax

     

    RadChart1.DefaultView.ChartArea.AxisY.AutoRange = true

    And make the example application fullscreen, the flickering is still there.

    (I am using Windows 7 64bit), fresh install

    The flickering is most visible when observing the gray/white stripes.

    Keyboard capturing works perfectly in the sample application.

    Wih kind regards,
    Rob

     

     

  6. Ves
    Admin
    Ves avatar
    2879 posts

    Posted 12 May 2010 Link to this post

    Hi Rob,

    With AutoRange set to true it would be expected to see flickering for a while. The reason is in the axis calculations. Every time a new data point is added to the chart, the axis range is recalculated and if the new datapoint  forced the y axis to change its range, you would see flickering as the axis elements are recreated. Is this the case?

    Kind regards,
    Ves
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
  7. Rob Peters
    Rob Peters avatar
    16 posts
    Member since:
    Feb 2010

    Posted 14 May 2010 Link to this post

    Hello Ves,

    Yes this is the case, except the Y-ax stays the same in range, meaning there should not be a recalculation/plotting, only when it actualy changes.
    Is it possible to create it this way?
    Sure i would expect a flickering when is actualy changes, or double buffering could solve this....

    With kind regards,
    Rob
  8. Ves
    Admin
    Ves avatar
    2879 posts

    Posted 19 May 2010 Link to this post

    Hi Rob,

    I can confirm we were able to reproduce the problem. I have logged it in our PITS, so our developers will investigate it -- you can find it here (the link will be active tomorrow):
    http://www.telerik.com/support/pits.aspx#/private/silverlight/2204

    I have also updated your Telerik points. I hope setting the Y axis range manually would be applicable for the time being.

    Best regards,
    Ves
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
  9. Rob Peters
    Rob Peters avatar
    16 posts
    Member since:
    Feb 2010

    Posted 29 Oct 2010 Link to this post

    Hello Ves,

    When i upgrade my Telerik controls to the latest version (2010.2.294.35), and run for example your supplied example, i have a problem with the horizontal scrollbar.

    For instance, if i want to make it smaller from the right side (click on the right side of the scrollbar and dragging to left), i see the bar being drawn to my mouse cursor position.
    But when i keep holding the left mouse button, the bar right position is going back and forth and making jumps.

    Is it possible to add a double click toggle on the scrollbars that swaps between your selection and full range?

    With regards,
    Rob
  10. Ves
    Admin
    Ves avatar
    2879 posts

    Posted 03 Nov 2010 Link to this post

    Hi Rob Peters,

    I reviewed the project once again and with the latest official assemblies. Indeed, the scroll bar (this is actually re-templated RadSlider) goes back and forth. The reason, however is the small timeout -- the slider acts upon releasing the mouse button, but if the chart is re-bound meanwhile the slider is reset back to its previous position.  As for the double click -- I am afraid this is not currently available.

    Best regards,
    Ves
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  11. Rob Peters
    Rob Peters avatar
    16 posts
    Member since:
    Feb 2010

    Posted 03 Nov 2010 Link to this post

    Hello Ves,

    I do not call rebind or anything.
    The charts itemsource is a RadHierarchicalObservableCollection

    Is there a work around for this? What has changed compared to the previous version that was working?
    Maybe i can overrule some function.

    With regards,
    Rob
  12. Ves
    Admin
    Ves avatar
    2879 posts

    Posted 05 Nov 2010 Link to this post

    Hi Rob,

    When the charts ItemsSource  is changed the chart is rebound. And when this happens the slider is re-drawn with its current settings. We have not changed anything in this regard, I just checked this example with 2010 Q1 SP1 assemblies (the actual ones at the time this thread started) and I am afraid this side effect exists there too. I am afraid this is just a conflict in this scenario (rebind while holding the slider handle) and I cannot provide a feasible workaround at the moment. I am really sorry for the inconvenience.

    Best regards,
    Ves
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
Back to Top
UI for WPF is Visual Studio 2017 Ready