Home forums Using CanvasJS Striplines performance

This topic contains 2 replies, has 2 voices, and was last updated by  Emeric 4 months, 1 week ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #15502

    Emeric
    Member

    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 ?

    #15505

    Bivek Singh
    Moderator

    @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

    #15524

    Emeric
    Member

    That’s better thank you !

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.