d3.js - 运行 D3 更新/进入/退出时，如何在新退出期间忽略已经存在的元素？

Question

每个人都知道更新/进入/退出模式:

function update(data) {

  // DATA JOIN
  // Join new data with old elements, if any.
  var text = svg.selectAll("text")
      .data(data);

  // UPDATE
  // Update old elements as needed.
  text.attr("class", "update");

  // ENTER
  // Create new elements as needed.
  text.enter().append("text")
      .attr("class", "enter")
      .attr("x", function(d, i) { return i * 32; })
      .attr("dy", ".35em");

  // ENTER + UPDATE
  // Appending to the enter selection expands the update selection to include
  // entering elements; so, operations on the update selection after appending to
  // the enter selection will apply to both entering and updating nodes.
  text.text(function(d) { return d; });

  // EXIT
  // Remove old elements as needed.
  text.exit().transition().duration(2000).attr('transform',
    rotation = 25;
    return 'translate(' + d.x + ',' + d.y + ') rotate('+ rotation +' 30 30)';
  }).remove();
}

我的问题是:

如果我在退出仍在发生时(在 2000 毫秒转换窗口期间)运行此函数，如何防止在已经进行 exit 转换的元素上调用转换。

换句话说，当进行原始选择时，它包含已经处于 exit().transition() 状态的元素。因此，如果这些元素未完成转换和 removed()，则会再次对这些元素调用退出转换。

我需要制作一个过滤器吗？是否有退出时的转换测试？

Answer 1

D3.js: Stop transitions being interrupted?说给退出元素一个特殊的类，然后使用它只允许新退出的元素进入退出过渡

.exit()
     .filter(function(d,i) {
        return !d3.select(this).classed("exiting");
     })
     .classed("exiting", true)
     .transition()
     ...

一个更大的问题是在第二次点击时重新引入的任何数据，而它仍然受到第一次点击的退出转换的影响。在您的示例中，当退出转换完成并调用该元素的删除时，您想要保留的元素将会消失。为了解决这个问题，我在过去添加了立即(零延迟，零持续时间)转换到我的更新中，并输入选择来覆盖/写入退出选择，如果它们还没有自己的转换(如果有更好的方法)有人让我知道)。

这就引出了另一点:在进入和更新时设置.classed("exiting", false)，所以在'退出'>'重新引入'>'再次退出的情况下' 元素未设置 .exiting 类，并且退出转换已激活。