Question

我假设作为d3调用链的一部分的.selectAll('.my_class').data([]).exit().remove()删除了带有css类my_class的非数据绑定元素，但语法让我感到困惑。意图是简单地清除甲板，删除所有元素。

无法解析它。

Answer 1

如果您还不了解输入/更新/退出和数据绑定，则很难解释。我会尽力帮忙。这个页面也应该解释很多，特别是进入和退出部分。

http://bost.ocks.org/mike/circles/

让我们开始进入。如果我们假设你有一个不包含圆形元素的svg元素，我们可以像这样添加4：

svg.selectAll('circle')
  .data([32, 57, 112, 293])
  .enter()
  .append('circle')
  .attr('r', function(d) { return Math.sqrt(d); });

这样做是选择svg元素中的所有圆元素（我们说没有）并将数据绑定到它们。由于数据数组中有4个元素，因此d3表示有4个元素需要添加。对.enter()和.append('circle')的调用将这些元素变为现实，对.attr('r', function(d) { return Math.sqrt(d); });的调用将其半径设置为绑定数据值的根。

现在让我们回答你的问题。我们现在有4个圆形元素，每个元素都有与之关联的绑定数据。如果我们使用不同的4个整数数组再次运行上面的代码，则不会添加新的圆圈。原因是选择了4个圆圈，传入了一个长度为4的数组，因此净差为0.但是，新数据将被绑定到圆形元素。即圆的半径会改变。

如果我们要运行这个怎么办：

svg.selectAll('circle')
  .data([])
  .exit()
  .remove()

我们正在选择4个圆圈，将空数组绑定到它们，这意味着有4个圆圈元素。 .enter()选项包含要添加的额外元素，而.exit()选择包含要删除的元素。

因此，我们选择4个圈子，不对它们进行任何绑定，调用.exit()，其中包含所有4个圈子，然后删除它们。

你是正确的，假设它清除了牌组，删除了所有类别＆＃39; my_class＆＃39;从页面。

希望有所帮助。

在d3中，构造.data（[]）。exit（）。remove（）是什么意思？

1 个答案: