为什么需要分隔一串方法？

Question

我正在基于 this example line chart 在 meteor.js 中实现一个反应折线图。在我为该图表提取的代码中，我有以下块，它工作正常。

var paths = svg.selectAll("path.line")
  .data([dataset]);

paths
  .enter()
  .append("path")
  .attr("class", "line")
  .attr('d', line);

paths
  .attr('d', line);

paths
  .exit()
  .remove();

然而，当我尝试编写如下内容时，轴仍然显示，但路径不呈现。为什么会这样？

var paths = svg.selectAll("path.line")
      .data([dataset])
    .enter()
      .append("path")
      .attr("class", "line")
      .attr('d', line)
    .exit()
      .remove();

Answer 1

这是因为您在不同的对象上调用函数。 D3 returns 更新、输入和退出调用 .data() 的选择——这就是您在第一个代码块的 paths 中存储的内容。然后您获得进入、更新和退出选择并处理它们。

在第二个代码块中，您调用 .enter() 之后处理输入选择。也就是说，.enter() 之后的所有代码都应用于输入选择，而不是像之前那样应用于其他选择。

所以 .exit().remove() 被调用在新附加的 path 元素上（这应该会给你一个错误）而不是 .data() 的 return 值作为在第一段代码中。

为什么需要分隔一串方法？

Why would a string of methods need to be separated?

javascript

svg

d3.js