How to create a real-time chart using SplineAreaSeries and updating item source at runtime?

[Deepinder Singh]

Hi There - I am creating an application which needs live data to be plotted on chart so that user can visualize the changes happening on our hardware device. I decided to use Syncfusion with SplineAreaSeries display type. I am able to show static data with no issues. But when I get new data from my websocket I don't find any way to update Item Source of SplineAreaSeries. I tried to work around by removing SplineAreaSeries and then adding it again with new Item source. This worked but after few attempts app crashes, I am not sure why but I am assuming that this is not the correct way.

I have googled regarding this and have not got any solution. Please share if there is any sample that I can refer to achieve a real time chart the most efficient way. Any help will be highly appreciated.

Thanks

-DS

[Saravana Pandian Murugan]

Hi Deepinder,

We have prepared sample based on your requirement which can be downloaded from the following location.

Sample: http://www.syncfusion.com/downloads/support/forum/123967/ze/LiveSplineAreaSample1042151129  

Thanks,
Saravana Pandian M.
 

[Deepinder Singh]

Thanks Saravana, sample helped me to resolve the issue.

Appreciate your help on this.

-DS

[Saravana Pandian Murugan]

Hi Deepinder,

We are glad to know that the given solution works. Please contact us if you need any further assistance.

Regards,
Saravana Pandian M.

[Qian]

Hi Deepinder,

We are glad to know that the given solution works. Please contact us if you need any further assistance.

Regards,
Saravana Pandian M.

Hi Saravana,

I have the same question. Your solution is good. But If I want to have a pause of the live data, is it possible to see all the history of our Data by a scroll gesture?

Thanks.

Qian Y.

[Parthiban Sundaram]

 Hi Deepinder,

We have prepared a sample based on your requirement using AutoScrollingDelta. Now, you can hold the live update by touching and by scrolling another finger to view the remaining data points. Please download the sample from the following location.

Sample: http://www.syncfusion.com/downloads/support/forum/123967/ze/Sample1661054155 

Thanks,
Parthiban S.  

[Qian]

Hi Saravana,

Thanks for your solution. It works well. 

I have another question, if I want to display the live data always from Left to Right. It means that when the data fills the screen the first time,  the live data restarts from the left side of the screen, until it fills the screen the second time, then it repeat the same action: starts with left side of the screen, ends with the right side of  the screen ...

When I have a pause, I can see all history by a scroll gesture.

I changed the Max and Min value of the Axis X for this moment to resolve this problem, but I don't think it's a good solution.

Do you have any other ideas about it?

Thanks.

Qian Y.

[Yuvaraj Palanisamy]

Hi Qian, 

We have prepared a sample for your requirement using actual range changed event. Please find the attached sample from the below location. 

Sample : http://www.syncfusion.com/downloads/support/forum/123967/ze/LiveSplineAreaSample-1880961557  

  

Thanks, 

Yuvaraj