Javascript 如何使用d3.js实现多行？

我正在尝试使用d3.js实现多行，参考 尽管本例中的函数希望将数组作为参数，但按照d3中的常规方法，我只能想到将参数作为函数传递。
有人知道如何将参数作为数组传递吗？或者用什么方法来改变函数以接受函数作为参数

将文本绑定到图表组件的代码段

arcs.append("svg:text")                                  
        .attr("transform", function(d) {                  

        d.innerRadius = 0;
        d.outerRadius = r;
        return "translate(" + arc.centroid(d) + ")";        
    })
    .attr("text-anchor", "middle")                          
    //.text(function(d, i) { return data[i].label; }); 
    .html(centerLinebreak(function(d, i) { 
        console.log([data[i].label,data[i].perc])
        return [data[i].label,data[i].perc];
    })); 

返回多行组件作为数组接收多行组件的代码段

function centerLinebreak(array){
  console.log(array)
  var string = "";
  var maxTextLength = d3.max(array, function(d){ return d.length })
  array.forEach(function(t, i){
    var l = (maxTextLength - t.length) /2;
    string += '<tspan class="line'+i+'" '+'y="' +i+ 'em" x="'+l+'em">' + t + '</tspan>'
  });
  return string
}

函数中心线分隔符（数组）{
console.log（数组）
var字符串=”；
var maxtLength=d3.max（数组，函数（d）{return d.length}）
forEach（函数（t，i）{
var l=（maxTextLength-t.length）/2；
字符串+=''+t+''
});
返回字符串
}

类似这样的操作（将制作阵列的逻辑移到

中心线打断功能中）

arcs.append（“svg:text”）
.attr（“转换”，函数（d）{
d、 内半径=0；
d、 外层=r；
返回“平移（“+弧形心（d）+”）；
})
.attr（“文本锚定”、“中间”）
//.text（函数（d，i）{返回数据[i].label；}）；
.html（centerLinebreak）//像这样调用函数
//将函数更改为接受数据和索引
函数centerLinebreak（数据，i）{
//制作阵列
var数组=[data[i].label，data[i].perc]；
var字符串=”；
var maxtLength=d3.max（数组，函数（d）{return d.length}）
forEach（函数（t，i）{
var l=（maxTextLength-t.length）/2；
字符串+=''+t+''
});
返回字符串
}
我尝试了这个实现。但我得到了错误“数据未定义”，因为数据未作为参数传递，因此我将
中心线分隔符（d，I）
设置为
中心线分隔符（数据，I）
arcs.append("svg:text")                                  
        .attr("transform", function(d) {                  

        d.innerRadius = 0;
        d.outerRadius = r;
        return "translate(" + arc.centroid(d) + ")";        
    })
    .attr("text-anchor", "middle")                          
    //.text(function(d, i) { return data[i].label; }); 
    .html(centerLinebreak); //call the function like this

//change the function to accept data and index 
function centerLinebreak(data, i){
 //make the array
 var array = [data[i].label,data[i].perc];

  var string = "";
  var maxTextLength = d3.max(array, function(d){ return d.length })
  array.forEach(function(t, i){
    var l = (maxTextLength - t.length) /2;
    string += '<tspan class="line'+i+'" '+'y="' +i+ 'em" x="'+l+'em">' + t + '</tspan>'
  });
  return string
}