Maximum number of data points supported on X-axis in CanvasJS(performance limit)

[komal.arora]

I’m using CanvasJS to render a multi-series chart. I need to plot a large number of data points along the horizontal (X) axis, and I’m concerned about performance.

Is there a recommended or maximum number of data points per series (or total) that CanvasJS can handle efficiently?

Beyond what point does performance (render speed, zooming, panning, responsiveness) start to degrade noticeably?

Are there any best practices (like data aggregation, sampling, lazy loading, etc.) to keep the chart smooth when dealing with thousands of points?

Thanks in advance!

[Thangaraj Raman]

@komal-arora,

CanvasJS can render millions of data points (line series) in just a few hundred milliseconds, smoothly. However, within a chart width of approximately 1000px, displaying millions of data points can overwhelm the visualization, making it hard to discern meaningful patterns. Instead, you can use data grouping or aggregation to create clearer, more insightful charts.

Check out this article for effective techniques like time-based grouping, random sampling, and stratified sampling: The Importance of Data Sampling and Grouping in Data Visualization.

Best Practices:

• Group data by time (e.g., hours, days) for time-series charts.
• Use random or stratified sampling for large datasets.
• Set markerSize: 0 to optimize rendering.
• Load data dynamically (e.g., via AJAX) for zoom/pan interactions.

Try out different sampling techniques to fit your data or scenario!

—
Thangaraj Raman
Team CanvasJS