应用了转换时的D3js排序问题

D3js sorting issue on transition applied

本文关键字：D3js 排序 问题 转换 应用      更新时间：2023-09-26

我有一个数据集已经通过d.id 绑定到svg:g

var categorized = g1.selectAll("g.node")
                    .data(dataset, function(d){return d.id})
                    .classed('filtered', false);
categorized.enter()
           .append("g")
           .attr("class", "node")
...

我使用一个函数从这样的数据值中排序：

var sorted = dataset
                 .filter(function(d) { return d.notation[3].value >=50 } )
                 .sort(function(a, b) { return d3.descending(a.notation[3].value,
                                        b.notation[3].value) });

当我console.log It 时，它返回正确的顺序

var filtered = g1.selectAll("g.node")
                 .data(sorted, function(d) {return d.id})
                 .classed('filtered', true);

仍然按照正确的顺序，如果I CCD_，但如果我应用延迟，它会反转的结果顺序

scored.transition()
      .delay(500).duration(1000)
      .attr("id", function(d) {
          console.log(d.id);
      });

但如果我去掉延迟，它会保持良好的排序。

我的问题是：我做的事情不好吗？

我想您已经注意到d3.js通常使用"优化"for循环来反向迭代（请参阅循环真的反向更快吗？以及其他引用）。

简单地反转您的选择是否有效？我不确定你在转换什么，所以你需要按照特定的顺序应用这两个步骤。

相关文章：