Javascript d3和x2B；svg+；从不同的文件中绘制许多图表+；迭代地

这是我的，我用它来建造

我想做的是能够绘制由不同文件构建的许多图表

所以我想我应该有一个带文件的变量数组，然后是一个for循环，fiddle。e、 g

小提琴能用，但它只画了一张图表。我认为这与下面的代码有关

var svg = d3.select("body").append("svg")
    .attr("width", width + margin.left + margin.right)
    .attr("height", height + margin.top + margin.bottom)
  .append("g")
    .attr("transform", "translate(" + margin.left + "," + margin.top + ")");

我想每个图表都需要一个svg，svg1…svgN，然后我需要附加到每个svg，svg1…svgN，而目前我在每个迭代中附加到相同的svg

  svg.append("g")
      .attr("class", "x axis")
      .attr("transform", "translate(0," + height + ")")

有人能帮我纠正错误，或者指出正确的方向吗？我可能需要一个更简单的例子来理解这个概念

EDIT1和是其他示例，但它重用了chart1和chart2的代码。我想减少使用for循环或类似的方法使用的代码

EDIT2我似乎不能做这样的事情，找到我想要的

id

并附加到它上面：

  svg("#id"+i).append("g")
      .attr("class", "x axis")
      .attr("transform", "translate(0," + height + ")")
      .call(xAxis);

EDIT4我想知道这是我应该采取的方法吗

arr=["data.csv","data2.csv"];

for(i=0;i<2;i++){       
//d3.csv takes a file path and a callback function                                          
d3.csv(arr[i], createChart);
//console.log("i:",i)
}

function createChart(data){
    console.log("test:",data)

    //draw chart with data
}

arr=[“data.csv”，“data2.csv”]；
因为（i=0；我在想那个太好的问题，希望有人能回答。我在想那个太好的问题，希望有人能回答。