Angular-nvd3 问题，将数据设置为 newData 时无法更新图表 [英] Angular-nvd3 issue, failed to update chart when set data to newData
问题描述
奇怪的问题不仅是nvd3指令，我已经进入指令源代码，但仍然没有找到原因.
如果我在 $scope.data 中设置一个新值，图表运行良好，但如果我设置一个 newData，图表将不起作用.
我已经调试了 angular-nvd3 指令，当我更改整个数据对象时，$watch('data') (angular-nvd3.js line 320) 仍然工作，但 scope.chart.update() 工作不正常.我没有找到 nvd3.js 保存图表数据的任何地方，所以我真的不知道发生了什么，为什么不工作....
It is a strange issue not only about nvd3 directive, I have steped into the directive source code, but still not find the reason.
I put it in plunker, switch comment line 34 and 35 in app.js will show the issue.
if I set a new value in $scope.data, the chart works well, but if I set a newData, the chart will not work.
I've debug the angular-nvd3 directive, when I change the whole data object, the $watch('data') (angular-nvd3.js line 320) still work, but the scope.chart.update() not working correct. I didn't found anywhere that nvd3.js hold the chart data, so I really don't know what happend, why not working....
任何评论都将受到赞赏！
Any comment will be a preciate!
推荐答案
我相信这是 nvd3 如何使用 d3 数据绑定的一个怪癖.
I believe this is a quirk of how nvd3 is using d3 data-binding.
初始数据数组像标准的 d3 可视化一样绑定到 DOM 并保存对它的引用.当您修改指令中的数组时，它会触发重绘，并且由于它是同一个数组(对其的引用)，因此绑定数据会更改并且绘图会正常重绘.
The initial data array is bound to the DOM like a standard d3 visualization and holds a reference to it. When you modify the array in the directive, it triggers a redraw and since it's the same array (reference to it), the bound data is changed and the plot redraws normally.
在第一次绘制后更改数组时，在引擎盖下，仍然绑定数据的数组是初始数组(没有数据的数组).该指令仍会触发重新绘制但没有数据.
When you change the array after the first draw, under the hood, the array that still data-binded is the initial array (the one with no data). The directive still triggers a re-draw but with no data.
做你想做的事，而不是调用 $scope.$apply(); 将 api 放入 $scope 中:
To do what you want, instead of calling $scope.$apply(); get api into the $scope with:
<nvd3 options="options" data="data" api="api" config="{refreshDataOnly: true}"> </nvd3>
然后使用:
$scope.api.updateWithData($scope.data);
更新了示例.
这篇关于Angular-nvd3 问题，将数据设置为 newData 时无法更新图表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
