Home forums Using CanvasJS Chart hangs with this code

Tagged: 

This topic contains 2 replies, has 2 voices, and was last updated by  Vishwas R 1 week, 4 days ago.

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

    bhaktaonline
    Member

    With the code below, the browser tab hangs, circling indefinitely.
    The issue appears to be the rendering of two data-points that are very close apart

    series1:
    dataPoints: [
    { x: 3.001084, y: 235 },
    ]

    series2:

    dataPoints: [
    { x: 2.991214, y: 234 },
    ]

    If I move the data points x of the series by 1 (increase or decrease), it works fine.. Looks like a bug?

    
    <!DOCTYPE HTML>
    <html>
    <head>  
    <script>
    window.onload = function () {
    
    var chart = new CanvasJS.Chart("chartContainer", {
        animationEnabled: true,
        zoomEnabled: true,
        theme: "light2",
        title:{
            text: 'Line chart that hangs',
            
        },
        legend: {
            cursor: "pointer",
            itemclick: function (e) {
                if (typeof (e.dataSeries.visible) === "undefined" || e.dataSeries.visible) {
                    e.dataSeries.visible = false;
                } else {
                    e.dataSeries.visible = true;
                }
                e.chart.render();
            }
        },
        axisX: {
            title: 'Time (secs)',
            
        },
        axisY:{
            title: 'Size (Bytes)',
            includeZero: false
        },
        
            data: [
            {
                        type: "line",
                        name: "144.0.0.2:49802",
                        showInLegend: true,
                        dataPoints: [
                            { x: 3.001084, y: 235 },
                        ]
            },
            {
                        type: "line",
                        name: "144.0.0.2:49804",
                        showInLegend: true,
                        dataPoints: [
                            { x: 2.991214, y: 234 },
                        ]
            },
            ]
        
    });
    chart.render();
    }
    </script>
    </head>
    <body>
    <div id="chartContainer" style="height: 370px; width: 100%;"></div>
    <script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
    </body>
    </html>
    
    
    #23349

    bhaktaonline
    Member

    try changing the 2.991214 to 2.591214 and the chart would load without an issue.

    #23361

    Vishwas R
    Keymaster

    @bhaktaonline,

    Thanks for reporting the use-case. We are looking into the issue and will get back to you at the earliest.


    Vishwas R
    Team CanvasJS

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

You must be logged in to reply to this topic.