D3.js Choropleth贴图：在“mouseover”中更改笔划颜色显示重叠边界

我对choropleth地图中的鼠标悬停事件有问题。我想突出显示边界，以便用户可以看到当前选定的功能。所有的工作都很好，因为一些边界要薄得多，或者根本不存在，这可能是因为它们是在相邻特征的边界下渲染的。以下是一个例子：

一些边界是正确的，其他部分更薄，第三部分根本不存在。Mike Bostock等人最近的研究解决了这个问题。解决办法是什么？这是我当前的

鼠标盖

代码：

.on("mouseover", function(d,i) {
  d3.select(this).transition().duration(300)
    .style({'stroke-opacity':1,'stroke':'#F00'});
})
.on("mouseout", function(d,i) { 
  d3.select(this).transition().duration(300)
    .style({'stroke-opacity':0.4,'stroke':'#eee'});
})

---

将相关元素移动到对等元素中的最后一个位置，使其覆盖所有邻居，如下所示：

.on("mouseover", function(d,i) {
    d3.select(this.parentNode.appendChild(this)).transition().duration(300)
        .style({'stroke-opacity':1,'stroke':'#F00'});
})

---

太好了，非常感谢！只有一个问题：这不会复制节点吗？是否应该在

mouseout

处删除副本？或者，也可以在

鼠标上方删除原始节点。否。当附加节点或以其他方式将节点附加到新的父节点时，会自动将其与以前的父节点分离，从而有效地将节点从一个位置移动到另一个位置。