d3:避免节点不变?

时间:2013-05-03 21:02:09

标签: javascript performance d3.js

当通过d3.js传递数据时,库将数据划分为输入/更新/退出组件,但我发现我们在更新部分中浪费了大量计算,以便通过重新计算保持不变的值并将属性重新设置为已经是当前的相同值。

有没有什么好方法可以将“更新”的集合进一步划分为已更改/未更改的集合?

2 个答案:

答案 0 :(得分:1)

您可以对更新选择进行其他选择。也就是说,再次使用选择器调用.selectAll(),该选择器仅为您提供需要更新的内容。这当然假设您可以生成这样的选择器。一种方法可能是通过CSS类完成所有操作,并在代码本身中不设置任何属性。然后你可以根据CSS类选择。

除此之外,没有什么可以真正做到的。 D3背后的整个想法是可视化由数据决定,如果数据不变,视觉元素也保持不变。

答案 1 :(得分:0)

您可以使用d3 filter函数根据任意值进一步过滤掉值。我过去曾使用过这种模式:

# store the extra value in the DOM to use for filtering later on:
selection.attr('data-someExtraValue', function(d) { return d.someExtraValue; });

# during the 'update' phase, filter out values who's someExtraValue hasn't changed:
filteredSelection = selection.filter(function(d) { return d.someExtraValue != parseInt(d3.select(this).attr('data-someExtraValue')); });

# do updates on the filtered selection rather than the initial selection...
相关问题