Highcharts :Cannot Read Property 'parentGroup' Of Undefined With AngularJS

I'm doing a chart using the highChart and angularJS. I follow this highChart. Here is my code: AngularJS: app.directive('hcPieChart', function () { return { restrict: 'E',

Solution 1:

I have the same problem and none of the answers helped me out. after several hours I figured out that the array which I was sending to the highchart component as the data feed to my chart, was causing the problem. the point is, that the y-axis records MUST be named as 'y' , not any other arbitrary name.

my data used to be like this:

data = [{name: "n1", income: 1491},
{name: "n2", income: 103103},
{name: "n3", income: 126886},
 {name: "n4", income: 88}]

and when i changed it to :

data = [{name: "n1", y: 1491},
{name: "n2", y: 103103},
{name: "n3", y: 126886},
 {name: "n4", y: 88}]

problem solved.

Solution 2:

According to $scope.Stat array object you have access each as $scope.Stat[0].Validate

Forked Plunker

$scope.pieData = [{
 name: 'CheckLists Socred',
                y:  $scope.Stat[0].Validate,
                color: '#00c853'
            },{
                name: 'CheckLists Not Socred',
                y: $scope.Stat[0].NotValidate,
                color: '#b71c1c'
        }];