Highcharts：无法使用AngularJS读取未定义的属性'parentGroup'
Posted
技术标签:
【中文标题】Highcharts：无法使用AngularJS读取未定义的属性\'parentGroup\'【英文标题】：Highcharts :Cannot read property 'parentGroup' of undefined with AngularJSHighcharts：无法使用AngularJS读取未定义的属性'parentGroup' 【发布时间】：2017-11-11 07:14:45 【问题描述】：我正在使用 highChart 和 angularJS 制作图表。 我关注这个highChart。
这是我的代码：
AngularJS：
app.directive('hcPieChart', function ()
return
restrict: 'E',
template: '<div></div>',
scope:
title: '@',
data: '='
,
link: function (scope, element)
Highcharts.chart(element[0],
chart:
type: 'pie'
,
title:
text: scope.title
,
plotOptions:
pie:
allowPointSelect: true,
cursor: 'pointer',
dataLabels:
enabled: true,
format: '<b>point.name</b>: point.percentage:.2f %'
,
series: [
data: scope.data
]
);
;
);
app.controller('ChartsController', function ($scope)
var ids =location.search;
$scope.Stats=function()
$http.get(url+"/Stats"+ids)
.success(function(data)
$scope.Stat = data;
).error(function(err,data)
console.log("error:" +data);
);
;
$scope.Stats();
/*$scope.Stat = [
"Validate":17.456789,
"NotValidate":2.96296,
"Nb_V":2.96296,
"Nb_Not_v":2.96296
];
*/
// Sample data for pie chart
$scope.pieData = [
name: 'CheckLists Socred',
y: $scope.Stat[0].Validate,
color: '#00c853'
,
name: 'CheckLists Not Socred',
y: $scope.Stat[0].NotValidate,
color: '#b71c1c'
];
);
html 代码：
<html > <head> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script> <script type="text/javascript" src="https://code.highcharts.com/highcharts.js"></script> </head> <body ng-app="app" ng-controller="ChartsController" > <hc-pie-chart title="Browser usage" data="pieData">Placeholder for pie chart</hc-pie-chart> </body> </html>
我得到了这张图表
当来自图表海报时，我有这个问题：
未捕获的类型错误：无法读取未定义的属性“parentGroup” 在 k.setState (App/Template/highcharts/highcharts.js:392:112) 在 App/Template/highcharts/highcharts.js:207:54 在 Array.forEach （本机） 在 a.each (App/Template/highcharts/highcharts.js:27:360) 在 a.Pointer.runPointActions (App/Template/highcharts/highcharts.js:207:32) 在 k.onMouseOver (App/Template/highcharts/highcharts.js:389:130) 在 SVGGElement.c (App/Template/highcharts/highcharts.js:380:323)
plnkr
谢谢你帮助我，
【问题讨论】：
你能在 jsfiddle 例子中重现它吗？ （你可以从类似的东西开始：jsfiddle.net/6vayegnk） 我使用了 jsfiddle，但无法正常工作 jsfiddle 当你让它工作时告诉我。或者您可以使用其他工具，例如 plunker 等。 我认为不是工具问题。但是代码中有问题plnkr 你的 script.js 是空的......你的 html 标签也有问题。 【参考方案1】：我有同样的问题，没有一个答案能帮助我。几个小时后，我发现作为图表数据馈送发送到 highchart 组件的数组导致了问题。 关键是，y 轴记录必须命名为 'y' ，而不是任何其他任意名称。
我的数据以前是这样的：
data = [name: "n1", income: 1491,
name: "n2", income: 103103,
name: "n3", income: 126886,
name: "n4", income: 88]
当我把它改成：
data = [name: "n1", y: 1491,
name: "n2", y: 103103,
name: "n3", y: 126886,
name: "n4", y: 88]
问题解决了。
【讨论】：
【参考方案2】：根据$scope.Stat 数组对象，您可以以$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'
];
【讨论】：
感谢您的回复@，我尝试这样做但它返回此错误消息；Can not read property 'resConforme' of undefined
我在上面的 plunker 中找不到，您能否详细说明错误
$Scope.Stat 它的内容是从 angularJS 中的另一个函数填充的。如何创建一个全局变量？我更新了帖子。 @深
你能在$scope.Stats()之后使用console,log($scope.Stat)检查并发现错误
显示其[object Object]以上是关于Highcharts：无法使用AngularJS读取未定义的属性'parentGroup'的主要内容，如果未能解决你的问题，请参考以下文章