CODEWITHSUNDEEP
javascriptchart.js
RJ White
RJ White

Reputation: 377

Adding data to line chart using addData() method in Chart.js

Sorry if this isn't the proper way to ask this. I do not have 'reputation 50' to comment on a response to an identical question, and etiquette says I should not 'Answer' with a question.

I have the same problem as described in Add data to line chart using chart.js but the solution does not work for me. I am running a newer version of Chart.js (1.0.1-beta.4), and I have tried the older version 1.0.1-beta.3 as suggested. Everything works for me except addData(). I have commented out other methods that do work.

BTW, it is not clear to me how addData() targets a specific dataset within the Chart. The documentation says: The values array passed into addData should be one for each dataset in the chart.
However, I am only using one dataset.
Below is my code made as trivial as possible to demonstrate my problem.

The error I get is: Uncaught TypeError: Cannot read property 'points' of undefined
I'm using Linux Mint 17 and Chrome Version 39.0.2171.71 (64-bit).

<!doctype html>
<html>
    <head>
        <title>Line Chart</title>
        <script src="/js/Chart.min.js"></script>
        <script>
            window.onload = function() {
                var ctx = document.getElementById("canvas").getContext("2d");

                var lineChartData = {
                    labels : ["1","2","3"],
                    datasets : [
                        {
                            label: "Pulse",
                            data: [ 50, 60, 70 ],
                        },
                    ]
                };

                var myLineChart = new Chart(ctx).Line( lineChartData, {} ) ;

                // myLineChart.datasets[0].points[2].value = 100 ; // works
                // myLineChart.update();       // works - resizes for y=100
                // myLineChart.removeData() ;  // works

                myLineChart.addData( [4,80], "4");    // doesn't work
            }
        </script>
    </head>
    <body>
        <div style="width:30%">
            <div>
                <canvas id="canvas" height="150" width="400"></canvas>
            </div>
        </div>
    </body>
</html>

Upvotes: 1

Views: 3399

Answers (1)

RJ White
RJ White

Reputation: 377

ok, I figured out what was wrong.
I misinterpreted how to use addData(). I thought the array supplied was a single set of x,y coordinates, but it is a set of y coordinates, 1 for each dataset, and the next 'label' arguement is the 'x' label.
I'm closing this.
Sorry to waste anyones time.

Upvotes: 2

Related Questions