饼图不能使用Json数据使用AngularJS和nvd3

Question

问题，

我想使用API​​的动态数据显示饼图，但它根本不起作用。就像我有一个硬编码的数据，它工作得很好。

我创建了一个Plunker

<nvd3-pie-chart 
     data="exampleDataPieChart" 
     id="toolTipExample2" 
     x="xFunction()" 
     y="yFunction()" 
     width="150" 
     tooltips="true"> 
    </nvd3-pie-chart> 

http://plnkr.co/edit/Ve9X22X7RAuRGpA74tiB?p=preview

我使用GitHub的API，并且想要画在用户信息库中使用的语言的饼图

请看看和让我知道我在哪里做错了

谢谢

Answer 1

两

Plunkr

两件事：你的JSON格式不匹配exampleDataPieChart，以及AngularJS不知道什么时候跑$scope.$apply()内部。

修复＃1：匹配格式

var exampleDataPieChart = [{"key":"One","y":5},{"key":"Two","y":2},{"key":"Seven","y":9}] 

与

var collectedData = [{"key":["JavaScript","CSS"],"y":[142531,205009]}] 

修复＃2：让AngularJS知道你已经创建一个本地var data那么一旦其准备更新的数据，通过运行$scope.collectedData = data触发$scope.$apply()。