Refreshing a few sparklines at once

6 posts, 0 answers
  1. Tamir
    Tamir avatar
    11 posts
    Member since:
    Dec 2011

    Posted 19 May 2012 Link to this post

    Hello,

    I am using 4-8 sparklines in one window. 
    Each getting new points (new ItemSource) twice/three times a second (using DataBinding). 
    The problem is that when I am trying to do other things in my window (for example opening a menu), the app takes time to respond.
    I believe that the reason for that is the amount of refreshes a second.
    I have three questions regarding that problem:
    1. Is sparkline the right control for my needs? Is there another one you would recommend?
    2. Is there any way to wait until I have the new points for all of my sparklines and only than refresh them all at once instead of each at a different time?
    3. What is the cause for this problem? is it the 
    GPU/CPU/Memory? (I believe that it has nothing to do with the other parts of my app because only when I added the sparklines this problem appeared)

    Thank you in advance

  2. Yavor
    Admin
    Yavor avatar
    401 posts

    Posted 23 May 2012 Link to this post

    Hello Tamir,

    Generally Sparklines are used to quickly visualize a set of data. In your scenario I believe that a charting control will be more suitable. We have developed a new charting solution with performance and memory in mind - the RadChartView. Take a look at our online demos here. I am sure you will be pleased with the performance improvement!

    Kind regards,
    Yavor
    the Telerik team

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

  3. UI for WPF is Visual Studio 2017 Ready
  4. Tamir
    Tamir avatar
    11 posts
    Member since:
    Dec 2011

    Posted 25 May 2012 Link to this post

    Well, 
    thank you for your help.
    I have tried to work with RadCartesianChart with a simple program:

        public partial class MainWindow : Window
        {
            private int m_dTimeBetweenChanges;

            private ObservableCollection<double> m_obcTracePoints;
            private Thread m_thrdPointsThread;

            public MainWindow()
            {
                InitializeComponent();
                m_obcTracePoints = new ObservableCollection<double>();


                Random rnd = new Random();
                for (int i = 0; i < 401; i++)
                {
                    m_obcTracePoints.Add(rnd.Next(0, 100));
                }

                m_dTimeBetweenChanges = 1000;

                this.chart1.Series[0].ItemsSource = new ObservableCollection<double>(m_obcTracePoints);

                this.m_thrdPointsThread = new Thread(new ThreadStart(ChangePointsThreadMethod));

                this.m_thrdPointsThread.Start();
            }


            private void ChangePointsThreadMethod()
            {
                int i = 0;
                Random rnd = new Random();
                while (true)
                {
                        for (i = 0; i < 401; i++)
                        {
                            this.m_obcTracePoints.Insert(i, (rnd.Next(0, 100)));
                        }
                    Thread.Sleep(this.m_dTimeBetweenChanges);
                    Dispatcher.Invoke(DispatcherPriority.Normal,
    (Action)delegate() { this.spark1.Series[0].ItemsSource = new ObservableCollection<double>(m_obcTracePoints); });
                }
            }
        }

    If I run it, it works extremely slowly. And that is with only one RadCartesianChart. 
    Am I doing something wrong?
    My RadCartesianChart is chart1. I am using random to create the points and then changing the ItemSource of the first Series. I tried to change the values of the ObservableCollection instead of creating a new one each time but then the chart throws an exception, System.InvalidOperationException.

  5. Yavor
    Admin
    Yavor avatar
    401 posts

    Posted 30 May 2012 Link to this post

    Hello Tamir,

    The reason why the chart throws an exception is because you are modifying the observable collection from another thread. You can try using a dispatcher timer instead, as it always ticks on the UI thread and no marshaling is required. Here is some code:

    public MainWindow()
    {
        InitializeComponent();
        m_obcTracePoints = new ObservableCollection<double>();
     
     
        Random rnd = new Random();
        for (int i = 0; i < 401; i++)
        {
            m_obcTracePoints.Add(rnd.Next(0, 100));
        }
     
        timer = new DispatcherTimer();
        timer.Interval = TimeSpan.FromMilliseconds(1000);
        timer.Tick += new EventHandler(timer_Tick);
        timer.Start();
     
        //m_dTimeBetweenChanges = 1000;
     
        this.chart1.Series[0].ItemsSource = m_obcTracePoints;
     
        //this.m_thrdPointsThread = new Thread(new ThreadStart(ChangePointsThreadMethod));
     
        //this.m_thrdPointsThread.Start();
    }
     
    DispatcherTimer timer;
    int i = 0;
    Random rnd = new Random();
     
    void timer_Tick(object sender, EventArgs e)
    {
        //for (i = 0; i < 401; i++)
        //{
            this.m_obcTracePoints.Insert(i, (rnd.Next(0, 100)));
        //}
    }

    If you have too many data points in the series you can use the sampling functionality of RadChartView which will reduce the number of points rendered while keeping the level of detail. Here you can find more information on this matter. Greetings,
    Yavor
    the Telerik team

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

  6. Tamir
    Tamir avatar
    11 posts
    Member since:
    Dec 2011

    Posted 02 Jun 2012 Link to this post

    Thank you for the answer!
    How do I bind a list of points through the xaml to the RadChartView?
  7. Petar Kirov
    Admin
    Petar Kirov avatar
    425 posts

    Posted 06 Jun 2012 Link to this post

    Hello Tamir,

    You can find information on how to data bind your ChartView in XAML in our documentation, and if you want to see MVVM in action check our demo here.

    Kind regards,

    Petar Kirov
    the Telerik team

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

Back to Top
UI for WPF is Visual Studio 2017 Ready