Javascript 通过D3删除文本

我正试图根据页面上的一些动态数据/用户输入更新一个图表。由于数据只是简单地放置在条形图列的底部，不需要移动，因此我认为我不需要任何动画。只需删除当前文本并替换为新值

下面的代码是我最好的猜测，但是它似乎没有起作用。

.append（）

工作正常，但它只是将新文本覆盖在旧文本上，最终变得不可读（显然）。似乎是

.remove（）

使用不当

对于D3.js来说比较新，所以如果有更好的方法/任何人有任何提示/提示，他们都会很感激

根据评论编辑

        //Remove the old text
        this.options.barDemo.selectAll("text.eoyValue")
            .data(data)
            .exit().remove();

        //Replace with the new text           
        this.options.barDemo.selectAll("text.eoyValue")
            .data(data)
            .enter().append("svg:text")
            .attr("x", function(d, i) { return x(i + .35) + barWidth; })
            .attr("y", height - 10)
            .attr("dx", -barWidth / 2)
            .attr("dy", "15px")
            .attr("text-anchor", "middle")
            .attr("style", "font-size: 12; font-family; Helvetica, sans-serif")
            .text(function(d) {
                console.log(d.attributes.contract);
                return d.attributes.contract;
            })
            .attr("transform", "translate(0, 18)")
            .attr("class", "eoyValue");

---

因此，除了没有添加类名之外，我也没有调用

transition（）

方法。下面的代码解决了这个问题

        this.options.barDemo.selectAll("text.eoyValue")
            .data(data)
            .enter().append("svg:text")
            .attr("x", function(d, i) { return x(i + .35) + barWidth; })
            .attr("y", height - 10)
            .attr("dx", -barWidth / 2)
            .attr("dy", "15px")
            .attr("text-anchor", "middle")
            .attr("style", "font-size: 12; font-family; Helvetica, sans-serif")
            .text(function(d) { return d.attributes.contract; })
            .attr("transform", "translate(0, 18)")
            .attr("class", "eoyValue");


        var columnBaseText = this.options.barDemo.selectAll("text.eoyValue").data(data, function (d, i) {
            console.log(i);
            return i;
        });

        columnBaseText.transition()
            .duration(1100)
            .attr("y", height-10)
            .text(function (d) {
                return d.attributes.contract;
            });

---

看起来您从未添加类

eoyValue

，因此

barDemo.selectAll（“text.eoyValue”）

将始终为空。谢谢，添加到帖子中。不幸的是，我遇到了一个类似的问题，

.remove（）

调用仍然没有拾取任何内容，而现在

.append（）

调用没有写入任何新值，它们都卡在页面加载时的

0.00

位置。如果我在

文本（）中放置
控制台.log（）

函数我看到

.append（）

调用仅在页面加载时启动。Chrome的调试器显示值更改时计算的代码块，但是

console.log（）

永远不起作用。