Javascript d3 tween用于文本返回NaN

在D3代码（版本4）中，我尝试在SVG文本中插入一个数字。我刚得到一份工作

总数的值为700

g.append("g")
.attr("transform", "translate(450,68)")
.append ("text")
.attr("text-anchor","middle")
.attr("alignment-baseline","central")
.attr("class", "hsidebar")
.transition()
.duration(2000)
.tween("text",testtween(totTotal));

function testtween(a) {
    console.log('in'+ a);
    var i = d3.interpolateNumber(1, a);
    return function(t) {
    d3.select(this).text(i(t));
  };

}

请让我知道我做错了什么

---

谢谢，

tween函数接受一个函数，该函数返回另一个函数。您正在为它返回函数。因此，我们需要将其包装在另一个函数中：

function testtween(a){
  return function() {
    var node = d3.select(this),
        i = d3.interpolateNumber(1, a);
    return function(t) {
      node.text(i(t));
    };
  };
}

运行代码：

变量g=d3。选择（'主体'）
.append（'svg'）
.attr（'width'，500）
.attr（'height'，500）；
var totTotal=700；
g、 附加（“g”）
.attr（“转换”、“翻译（450,68）”）
.append（“文本”）
.attr（“文本锚定”、“中间”）
.attr（“路线基线”、“中心”）
.attr（“类”、“类”）
.transition（）
.期限（2000年）
.tween（“文本”，testtween（700））；
函数testtween（a）{
返回函数（）{
变量节点=d3。选择（此），
i=d3.插值枚举数（1，a）；
返回函数（t）{
文本（i（t））；
};
};
}