为什么我的d3工具提示没有正确更新？

Question

我使用的是jsfiddle。当我将鼠标悬停在条上时，所有的提示最初都是正确的。但是当我单击周视图按钮来更改图形时，工具提示不会更新。

我相信这个问题是在本节：

layer.enter() 
    .append("g") 
    .attr("class", "layer"); 

layer.attr("fill", function (d, i) { 
    return color(i); 
    }) 
.append("svg:title") 
.text(function(d){ 
    return d[0].s; 
}); 

layer.exit() 
    .remove(); 

附加文字是我添加工具提示。我认为进入和退出会刷新栏，因此刷新工具提示，但它没有正确执行。

如何在图形更改时更新工具提示？

Answer 1

这是因为每次更改条形图时都会添加一个新的<title>元素。追加应该在输入选择上完成一次，然后在更新选择中简单更新标题的值。

这是你的代码的修改版本的一些评论在线（我已删除了不相关的刀尖部分）：

layer.enter() 
    .append("g") 
    .attr("class", "layer") 
     .append("title"); // add new element under new layer 

// add or update the value of the title element 
layer.select("title").text(function(d) { 
    return d[0].s; 
});