Example of Lazy Loading in React Chart Component


This sample illustrates lazy loading feature in chart which loads data on demand.

More Details...


In this example, you can see how to load data for the chart on demand. The chart will fire the scrollEnd event, and in that event, we can update the chart with the required data based on the point length and axis range. The scrollbar in the chart can be customized using the height, trackColor, trackRadius, scrollbarRadius, scrollbarColor, enableZoom, and gripColor properties in scrollbarSettings.

Injecting Module

Chart component features are segregated into individual feature-wise modules. To use lazy loading need to inject ScrollBar and Zoom modules into services.

More information about the lazy loading can be found in this documentation section.