更新enter().append()块中的数据d3.js

Updating data in the enter().append() block d3.js

本文关键字：数据 d3 js enter append 更新      更新时间：2023-09-26

我正在使用D3js和AngularJS从web服务等进行数据检索的交互式可视化。

可视化基于分区布局。它接收一个3层嵌套JSON对象，使用d3.partition().nodes(JSON)将其转换为节点。

最初加载可视化时，它会在enter().append()块中的节点上设置一些额外的属性，如下所示:

 scope.path = viz.selectAll("path")
  .data(nodes, function(d){ return d.pk; }); // Make sure to have a unique id
 scope.path.enter().append("path")
  .attr("d", function(d){
    // if selected or one of the children is selected, slide out
    if(d.selected || d.childrenSelected ){ d.dy = 0.4; }
    return arc(d);
  });

在我使用AngularJS之前，这对我很有效，因为我假设节点中的每个节点都是通过引用来评估的。因此，每当呈现的节点发生变化时，节点集合中的节点也会发生变化(它们是相同的)。

在AngularJS中，这个小系统停止工作了，我正在重新考虑这个方法。我希望只修改enter().append()块之外的数据。我的问题是什么是一个很好的方法，我应该如何重新渲染视觉效果?节点的数据在单击时发生变化，并且还可能对父节点产生影响。

一些想法，希望你认为这些有用。如果你打算改变Angular模型中使用的数据，一定要在改变数据后运行$digest(在某些情况下可能会消耗资源)，或者使用$watch来跟踪变量的变化，并在需要时采取行动(例如，在变量被改变后重新渲染视觉效果)。否则，Angular不会知道这些变化。

以下链接可能会有所帮助:
http://angular-tips.com/blog/2013/08/watch-how-the-apply-runs-a-digest/
http://www.benlesh.com/2013/08/angularjs-watch-digest-and-apply-oh-my.html

相关文章：