Javascript d3 bl.ocks极时钟ex问题

这里有一个很棒的d3极时钟示例-

如果有人愿意花点时间解释的话，我有几个问题想问一下引擎盖下到底发生了什么

一,

从文件上看，这本质上等同于

d3.select(document).transition().duration(0).each(tick)

那么，这应该首先控制文档在视图中的转换吗？我试着给duration一个大于0的值，它就像一个延迟，而不是动画。我曾尝试向tick fn添加一些内容，以控制视图中的动画元素，但它似乎从未设置任何动画。这与仅仅调用tick（）不同的工作示例将非常有用

二,

如果我理解1，这可能更有意义。更好的是，我不了解的主要方面是“这”是如何被利用的。d、 正在将值复制到此。\u值。“这是HTML dom元素吗？我尝试过在这行代码的正下方使用console.log（this），但它没有显示任何_value属性。 如果您能解释一下这里发生了什么，我们将不胜感激。这与d之间的根本区别尤其明显

在这种情况下，它的功能相当于简单地调用

tick（）

（请参阅）。我可以看到，使用

d3.transition（）

的优点是，您将转换中的一些元数据与文档元素相关联，而这不是简单调用函数时的情况。原则上，您可以使用此元数据来停止转换，尽管示例中没有使用此元数据

d

指绑定到

字段

中的

g

元素的数据，而

此

指的是实际的DOM元素。在控制台中看不到这一点，因为打印的表达式在打印时不求值，而是在展开时求值。也就是说，您在检查控制台时看到的不是打印值时看到的

---

代码所做的是用DOM元素保存上一个值（这是必要的，因为数据（

d

）通过调用

.data（）

）进行更改，以便能够在不同的值之间正确转换（例如，有关需要访问上一个值的另一种情况，请参阅）

“您在控制台中看不到这一点，因为打印的表达式在打印时不求值，而是在展开时求值。“这是不对的。我已经在FF、IE11和Chrome的控制台中检查了这种行为。所有这些都是在打印时评估表达式。因此，您可以使用

console.log（this.hasOwnProperty（“\u值”））

检查是否存在，或者使用

console.log（this.u值）

打印该值。听起来OP好像在记录

此

并在以后进行扩展。

d3.select(document).transition().duration(0).each(tick)

function tick() {
  field = field
      .each(function(d) { this._value = d.value; })
      .data(fields)
      .each(function(d) { d.previousValue = this._value; });