csvファイルからd3.jsを使用して複数行のグラフを作成する

Question

私のCSVファイルで複数行のグラフを作成しようとしています。私は別に

//This is for the line A  
    var lineGen = d3.svg.line() 
        .x(function(d) { 
         return xScale(d.date); 
        }) 
        .y(function(d) { 
         return yScale(d.A); 
        }) 
        .interpolate("basis"); 
//This is for the line B 
    var lineGen2 = d3.svg.line() 
        .x(function(d) { 
         return xScale(d.date); 
        }) 
        .y(function(d) { 
         return yScale(d.B); 
        }) 
        .interpolate("basis"); 

var data = d3.csv("new_test2.csv", function(data) { 
      vis.append('svg:path') 
       .attr('d', lineGen(data)) //This is for the line A 
       .attr('stroke', 'green') 
       .attr('stroke-width', 2) 
       .attr('fill', 'none'); 

      vis.append('svg:path') 
       .attr('d', lineGen2(data)) //This is for the line B 
       .attr('stroke', 'blue') 
       .attr('stroke-width', 2) 
       .attr('fill', 'none'); 
      }); 

それがうまく機能し、それらを作成しようとしています

date,A,B 100,1,0 101,2,0 102,3,0 103,4,0 104,5,0 105,6,1 106,7,2 107,8,3 108,9,4 109,10,5 110,11,6

そして、最初： csvファイルの内容は、次のようになります！ しかし明らかにほとんどのコードはでも冗長すぎるだから、別の列で同じことをやっているだけなのです。 各列に1つずつアクセスして別の行をプロットする方法があるのだろうか？

function draw_line(c, data){ 
        console.log(c); 
        var lineGen = d3.svg.line() 
         .x(function(d) { 
          return xScale(d.date); 
         }) 
         .y(function(d) { 
          console.log(d[c]); 
          return yScale(d[c]); 
         }) 
         .interpolate("basis"); 
        lineGen(data); 
       }; 
var data = d3.csv("new_test2.csv", function(data) { 
        vis.append('svg:path') 
        .attr('d', draw_line('A', data)) 
        .attr('stroke', 'green') 
        .attr('stroke-width', 2) 
        .attr('fill', 'none'); 

        vis.append('svg:path') 
        .attr('d', draw_line('B', data)) 
        .attr('stroke', 'blue') 
        .attr('stroke-width', 2) 
        .attr('fill', 'none'); 
       }); 

しかし、それは任意の行をプリントアウトしませんが、console.logで返された値をチェックするとき、すべてが完全に罰金だ：今私は、引数を処理するためにJavaScript関数を使用しようとしているために

。 ここで何がうまくいかないのですか？助けてください！ '（

感謝を提供し、すべての答えを

（私はおそらくforループのすべてのカラムを通過するために使用しようとしているが、私が処理するかどうかはわかりませんvis.append partのために色 - 私はまだこの部分では動作していないので、異なるcolor--に各ラインのショーを作るために）

Answer 1

function draw_line(c, data){ 
        console.log(c); 
        var lineGen = d3.svg.line() 
         .x(function(d) { 
          return xScale(d.date); 
         }) 
         .y(function(d) { 
          console.log(d[c]); 
          return yScale(d[c]); 
         }) 
         .interpolate("basis"); 
        lineGen(data); // this line should be return 
       }; 

return lineGen(data);