javascript - 从 D3.js v3 迁移到 D3.js v4 不起作用 - 一个选择问题？

Question

我正在尝试迁移这个 JSFiddle在 D3 v3 到 D3 v4 中，但它不工作。

我知道 D3 拖动行为现在只是 d3.drag() 我已经改变了，但是当试图运行它时，它在第 53 行给出了一个错误:

rect = d3.select(self.rectangleElement[0][0]);

Chrome 说:

Uncaught TypeError: Cannot read property '0' of undefined

我该如何更改此 JSFiddle 以使其在 D3 v4 中运行？

Answer 1

从 D3 v4 开始，选择不再是数组的数组，而是一个对象。 changelog有它:

Selections no longer subclass Array using prototype chain injection; they are now plain objects, improving performance.

在 v3 中执行 self.rectangleElement[0][0] 时，您访问的是选择中的第一个节点。要在 v4 中获取此节点，您需要调用 selection.node()在 self.rectangleElement 上。这样你的代码就变成了:

rect = d3.select(self.rectangleElement.node());

查看更新后的 JSFiddle对于工作版本。