D3 - 点击时添加文字

Question

我试图追加，然后在用户点击一个小绘图节点（d3）时删除一些文本。我有点击功能，但我正在努力添加一些文字。这就是我所拥有的 -

.on("click",function(d){
          d3.select(this)
           .append("text")
    .attr("dx", function(d){return -20})
    .text(function(d){return d.depth})
            .transition()
            .duration(600)
            .attr("r",function(d){
                  return d.depth;
              })
            .attr("opacity", 0.1)
            .transition()
            .duration(2000)
            .attr("r",function(d){
                  return d.magnitude/1.5;
              })
            .attr("opacity", 0.8)
            //remove text here
        })

如果我没有像这样的文本的附加部分 -

，这可以正常工作

  .on("click",function(d){
          d3.select(this)
            .transition()
            .duration(600)
            .attr("r",function(d){
                  return d.depth;
              })
            .attr("opacity", 0.1)
            .transition()
            .duration(2000)
            .attr("r",function(d){
                  return d.magnitude/1.5;
              })
            .attr("opacity", 0.8)
        })

所以我只是尝试弹出文本，然后在动画完成后删除。