How to specify axis range without altering the data source

We are using the ejs-chart component (line chart) in Angular to handle real-time data. We would like to be able to specify an axis range directly without modifying the data source. This means the data source could potentially have data points that are outside the bounds/range of the chart view. 

We have found a few similar things to what we want to do, but not exactly:

https://ej2.syncfusion.com/documentation/chart/zooming/
With the zoom, it's what we want but we want to be able to do the zooming programmatically. 

Currently, we want to maintain a viewing range of 10min and in order to do that we remove all data points older than 10mins and refresh the chart. Are there any better ways of going about this?


1 Reply

DG Durga Gopalakrishnan Syncfusion Team November 11, 2021 03:27 PM UTC

Hi August, 

Greetings from Syncfusion. 

We have analyzed your queries. We suggest you to use chart lazy loading feature to achieve your requirement. It is used to load the data for chart series on demand. For each scroll, chart scrollEnd event will be triggered and new data will be assigned for chart series datasource based on point length, axis range and then chart will be updated automatically. 


Kindly revert us if you have any concerns. 

Regards,  
Durga G

Loader.
Up arrow icon