asynchronous data question about angular-chartjs HOT 12 CLOSED

I actually got to fix the problem myself, the solution was ridiculous and made me feel retarded.
The structure of the 'data' array should be something like:
data = [[1, 2, 3, 4], [8, 7, 6, 5] ]
Problem was that I had only one series, not more, therefore from the backend I sent a response looking like:
response = [1, 2, 3, 4]
Whereas the correct version would have been
response = [[1, 2, 3, 4]]
And well, the solution was to simply set:
scope.data = [response]

I'm pretty sure I'm the only one with this problem as it's ridiculously obvious however, maybe, just maybe someone else has encountered this as well and is struggling with it so that's why I took the time to write it.
All the best!

from angular-chartjs.

I believe I had a similar problem. When requesting data in an asynchronous callback, I get the error TypeError: Cannot read property 'datasets' of undefined

This can be reproduced in the test code app.js by putting $scope.activeData = $scope.lineChartData in a setTimeout.

from angular-chartjs.

I believe this is solved by defining the datasource on the scope immediately, then "populating" it as the async callback runs.

datasource: {
  labels: [],
  datasets: []
}

from angular-chartjs.

I believe that is true. Regardless I'll improve that in a future release. Thanks for the info, closing for now. Please re-open if new information.

from angular-chartjs.

Hi,

is it possible to give morge information about this section? I am trying to fetch data from a JSON file with an $http-function in Angularjs but I received the same error as described above. In my console.log ($scope.date = data;) I receive a succes message but my data doesn't display in my html.

Can someone help me with this problem.

Big thanks.

from angular-chartjs.

I'm facing the same error.

<canvas class="chart chart-bar" chart-data="chart.data" chart-labels="chart.labels">

app.controller('dashboardController', function($scope, Sales) {
    $scope.chart = {
        labels: [],
        data: []
    }

    Sales.get().then(function(data) { // async data call via REST API
        for (i = data.length - 1; i >= 0; i--) {
            date = moment().month(data[i].month).year(data[i].year).format('MMM YYYY');

            $scope.chart.labels.push(date);
           $scope.chart.data.push(data[i].total);
        }
    });
});

As you can see I've already initialised the two arrays at the top of the controller, but am still getting the same cannot read property 'length' of undefined error

from angular-chartjs.

Having the same issue. Any solutions?

from angular-chartjs.

Thanks Alex.. I got this error and cleared it now because of your comment

from angular-chartjs.

Haha! Good to know ☺️

from angular-chartjs.

Still facing the same issue, don't know if you can provide details about how you solved it. I want to provide a barchart and still running into same length issue, if i provide response, the data are blank.

thanks

from angular-chartjs.

@dfemo: You are probably trying to access an undefined array somewhere in your code. Make sure to define the structure of your data immediately, then populate the structure when the data arrives.

You can't do something like data.item.properties.length without doing something like this first:

var data = {
  item: {
    properties: []
  }
};

from angular-chartjs.

Thanks, Alex. I didn't notice the array of arrays, and hit the same error as the OP. Your post helped me fix it.

from angular-chartjs.