D3.js 顶部每个条中堆栈的总值

我有一个堆叠的条形图。JSFIDLE是

我添加了一个文本，它实际上是每个条顶部所有堆栈的总和

layer.selectAll("rect")
            .data(data)
            .enter().append("text")
            .attr("text-anchor", "middle")
            .attr("x", function (d) { return x(d[chartType]) + x.rangeBand() / 2; })
            .attr("y", function(d)
            {
                return y(sumOfStack(chartType, data, d[chartType], xData)) - 5;
            })
            .text(function(d)
            {
                return sumOfStack(chartType, data, d[chartType], xData);
            })
            .style("fill", "4682b4");

而sumOfStack（）方法实际返回y的值。它汇总了所有堆栈值

function sumOfStack(dataType, data, xValue, sources)
{
    var sum = 0;
  for(var i=0; i<data.length;i++){
    
    if(data[i][dataType] != xValue) continue;

      for(var j=0; j<sources.length; j++)
      {
        sum+= data[i][sources[j]];
      }

    console.log(sum);
    return sum;
  }
}

函数sumOfStack（数据类型、数据、xValue、源）
{
var总和=0；
对于（var i=0；i您只使用选择的append部分，它负责新元素，而您需要更新的文本已经存在，因此它们不属于enter（）部分，而是属于现有选择

用此代码替换总计，它应该可以工作：

   var totals = svg.selectAll('text.totalLabels')
              .data(data);
            
            totals
            .transition()
            .duration(500)
            .attr("x", function (d) { return x(d[chartType]) + x.rangeBand() / 2; })
            .attr("y", function(d)
            {
                return y(sumOfStack(chartType, data, d[chartType], xData)) - 5;
            })
            .text(function(d)
            {
                return sumOfStack(chartType, data, d[chartType], xData);
            });
            
  totals.enter().append('text')
            .attr('class', 'totalLabels')
            .attr("text-anchor", "middle")
            .attr("x", function (d) { return x(d[chartType]) + x.rangeBand() / 2; })
            .attr("y", function(d)
            {
                return y(sumOfStack(chartType, data, d[chartType], xData)) - 5;
            })
            .text(function(d)
            {
                return sumOfStack(chartType, data, d[chartType], xData);
            })
            .style("fill", "4682b4");
            
 totals.exit().remove();