如何使用d3将圆环带到前面？

如何使用d3将圆环带到前面？

您将不得不更改对象的顺序，并使鼠标悬停的圆圈成为最后添加的元素。正如您在此处看到的那样：并根据nautat的建议，必须在主脚本之前定义以下内容：

d3.selection.prototype.moveToFront = function() {  return this.each(function(){    this.parentNode.appendChild(this);  });};

然后，您只需在鼠标悬停时

moveToFront

在您的对象上调用函数（例如

circles

）：

circles.on("mouseover",function(){  var sel = d3.select(this);  sel.moveToFront();});

编辑： 根据Henrik Nordberg的建议，有必要使用的第二个参数将数据绑定到DOM

.data()

。为了不丢失对元素的绑定，这是必需的。请阅读Henrick的答案（并支持！）以获取更多信息。作为一般建议，始终使用将

.data()

数据绑定到DOM时的第二个参数，以利用d3的全部性能。

---

编辑： 如Clemens Tolboom所述，反向功能为：

d3.selection.prototype.moveToBack = function() {    return this.each(function() {        var firstChild = this.parentNode.firstChild;        if (firstChild) { this.parentNode.insertBefore(this, firstChild);        }    });};