render performance

[yueming]

Our client complains the zoom/rescale functionalities is lagging, even the markerType is set to none. I am afraid it is because there are too many data points. We use line chart. There are four lines, 100,000 data points in each line.

Is there any way to improve the render performance?

• This topic was modified 6 years, 9 months ago by yueming.
• This topic was modified 6 years, 9 months ago by yueming.

[Suyash Singh]

@yueming,

Rendering multiple dataSeries will 100k dataPoints would take a bit to render. However, filtering dataPoints based on the zoom level will improve the performance. Please take a look at this jsfiddle.

___
Suyash Singh
Team CanvasJS

[yueming]

Thanks. I tried your solution and it works but the side effect is there is obvious image distortion. I think it is because the algorithm is too simple. Is there algorithm to reduce the number of data points at the same time with less image distortion?

[Suyash Singh]

@yueming,

You can increase/decrease the number of dataPoints within the axis range as per your requirements and it should work fine.
var range = Math.round(e.axisX[0].viewportMaximum - e.axisX[0].viewportMinimum);

___
Suyash Singh
Team CanvasJS