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

Question

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

我认为问题出在这部分：

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> 元素。追加应该在输入选择中完成一次，然后只需在更新选择中更新标题的值。

这是您的代码的修改版本，其中包含一些内联 cmets（我已删除与工具提示无关的部分）：

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;
});