Striplines performance

[Emeric]

Hello,

I would like to add a lot of stripLines (~100) to my chart but the problem is: the loading is really long.
My chart has a lot of data (~100 000 points) and the loading is really fast (~500ms) but when I want to add a lot of stripLines it takes a long time to load (~10 seconds = 10000ms).

Here is my function creating the stripLines from an external file (json):

function getAnnotation(){
  $.getJSON("striplines.json", function(data){
    $.each(data, function(key, value){
      chart.axisX[0].addTo("stripLines", {value: value, lineDashType: "dot",});
    });
  });
}
getAnnotation();

Is it the stripLines which are taking a lot of performance or am I just doing it wrongly ?

[Bivek Singh]

@Emeric

You can disable the rendering of chart each time a stripline is added by setting the fourth parameter to false in addTo method. It is taking long time to render since you’re rendering the chart each time a stripline is added as the fourth parameter is set to true by default. You will still need to render the chart once you are done with adding all the striplines.

$.each(data, function(key, value){
    chart.axisX[0].addTo("stripLines", {value: value, lineDashType: "dot"}, 0, false);
});
chart.render();

Please update the changes in your code and it should work fine.
—-
Bivek Singh,
Team CanvasJS

[Emeric]

That’s better thank you !