Slow rendering for real time line chart

[William]

Hi,

I am making a real-time dashboard for IoT devices. The charts will update once per second. I noticed that when I have four charts - the rendering time seems to be quite "slow" across the 4 charts. The change in each chart is very noticeable - i.e. you can see the lines on the graphs re-rendering and I find it quite distracting. It gets slower as the number of data points in the bound DataSource grows.

I have attached a basic example - where I start with 1 minute of data, then I am firing a timer every 1 second, that adds data to an ObservableCollection, and then forces a refresh. Is there a way to speed up the rendering so it doesn't appear too noticeable? Or is there something fundamental that I am missing? I have tried it on Chrome and Edge - it is worse in Chrome.

Please find the project attached. 

Attachment: SyncFusionBlazorChart_submit_b18df085.zip

[William]

Additional info: I used a SyncFusion template for Blazor-server side. I am running it locally. The charts on the the "Live Data" tab in the Navbar.

I have attached a video of what I am seeing.

Thanks.

Attachment: Chart_updates_876fecc0.zip

[Srihari Muthukaruppan]

Hi William, 

We have analyzed your query. From that, we would like to let you know that we are able to reproduce the issue. We are working on the possible solutions to overcome this issue. Due to some technical difficulties we will update the status within two business days (January 29). We appreciate your patience until then.  

Let us know if you have any concerns. 

Regadrs 

Srihari M 

[William]

Thanks Srihari. I look forward to hearing from you.

Regards

William

[Srihari Muthukaruppan]

Hi William,  

Most welcome.  

As promised we will update the status on January 29. 

Let us know if you have any concern   

   

Thanks,   

Srihari M 

[Kalaimathi Chellaiah]

Hi William, 

 

Sorry for the inconvenience caused. 

We are able to reproduce the reported bug and logged it in our backlog. You can keep track of the bug from the feedback portal below.  

 

Feedback Link: https://www.syncfusion.com/feedback/11639/ 

 

The fix will be available in our upcoming weekly patch release which is scheduled to be rolled out on or before February 4^th, 2020.  

If you have any more specification/precise replication procedure or a scenario to be tested, you can add it as a comment in the portal.  

Regards, 

Kalai. 

 

[Srihari Muthukaruppan]

Hi William, 

Thanks for being patience. 

 

We are glad to announce that our v17.4.47  patch release is rolled out, we have added the fix for the reported issue and is available for download under the following link.  

Npm Packages: https://www.npmjs.com/~syncfusionorg 

We would also like to let you know that we achieved your requirement by calling “RefreshLiveData” in the chart. We have also prepared a sample for your reference. Please find the below sample and code snippet.  

Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/MultipleLiveChart1166706392.zip  

 

Code Snippet: 

    EjsChart Chart; 

    EjsChart Chart1; 

    EjsChart Chart2; 

    EjsChart Chart3;    

 

protected override void OnInitialized() 

    { 

        // create the timer 

        t = new System.Timers.Timer(1000); 

        t.Start(); 

 

        // when it elapses, add a newly created LiveData, and refresh 

        t.Elapsed += async (s, e) => 

        { 

            dataSource.Add(new LiveData { TimeStamp = DateTime.Now, Value = rng.Next(0, 100) }); 

            this.Chart.RefreshLiveData(); 

            this.Chart1.RefreshLiveData(); 

            this.Chart2.RefreshLiveData(); 

            this.Chart3.RefreshLiveData(); 

        }; 

    } 

 

We appreciate your patience in waiting for this release. Let me know, if you need further assistance.  

  

Regards,  

Srihari M 

[William]

Thank you - this did solve my issue.

[Srihari Muthukaruppan]

Hi William,  

Most welcome. Kindly get in touch with us, if you requires further assistance. We are always happy in assisting you.   

   

Thanks,   

Srihari M