Javascript D3JS：我无法迭代数组

我试图在几个图表下面添加一些文本，比如使用D3JS的标题。为此，我尝试添加一个g元素，并在其中添加一个文本元素，然后尝试通过jQuery访问文本元素数组，以使用以下路径设置html：

$("#pie"+ i).find("text:nth-child(4)").eq(1) 

，它指向每个圆环图下面的文本，并使用for循环尝试设置存储在字符串数组中的某些文本，但无法遍历文本元素数组。你能告诉我出了什么问题吗

这就是我试图做但没有成功的事情：

   g.append("text")
        .attr("transform", "translate(0,60) scale(.7)")
        .attr("class","caption")

    var captionArr = ["chart 1","chart 2","chart 3","chart 4","chart 5","chart 6","chart 7","chart 8"]    

    for(i = 1; i <= $(".caption").lenght; i++){
     ($("#pie"+ i).find("text:nth-child(4)").eq(1)).html(captionArr[i])
    }   

这是我的小提琴：

谢谢你的帮助，我非常感谢。

为什么不：

drawDonut(data1, "#pie1", "Chart 1")

...

function drawDonut(data, divchart, chartName) {
  ...
  g.append("text")
    .attr("transform", "translate(0,60) scale(.7)")
    .attr("class", "caption")
    .text(chartName);
}

---

您的代码有两个主要问题：

主要问题是，您将text.caption添加到SVG中的每个元素，这将导致$'.caption'.length==16，这不是我认为您需要的，因为您试图为每个图表添加1个标签标题。如果不是这样，请让我知道，我会编辑这篇文章。 你试图在绘制图表之前更改文本。所以你必须把for循环移到draw调用下面

要修复上面的1，以下是需要附加到svg而不是g的相关更改：

使用jQuery的方法1：

甜甜圈男人女人

---

你在循环中拼错了长度。你可以在编辑器中发布JS/HTML/CSS代码片段Ctrl-M，或者使用可复制的示例发布codepen/JSFIDLE吗？既然你可以在d3中执行，那么为什么要在jQuery中执行此操作呢。只需使用i%4==0或i+1%4==0筛选从第四个子项d3返回的选择提示：您的变量i是全局可用的添加变量或更改其范围这是工作演示的一部分，但它不会显示图表下方的文本

svg.append("text")
  .attr("transform", "translate(0,60) scale(.7)")
  .attr("class", "caption");

for (var i = 1; i <= $(".caption").length; i++) {
  $("#pie" + i).find("text.caption").html(newarr[i-1]); // as array index starts from 0
}