カラーコーディングパラレル座標

Question

私はすでにコードパラレル座標グラフを持っていますが、すべて正常に動作します。今私は平行座標の視覚化を色分けするために色を使用しようとしていますが、何かが間違っています。データセット（http://archive.ics.uci.edu/ml/machine-learning-databases/wine/wine.data）では、ワイン種の名前が異なります（1列目はクラス識別子（1-3）です）が、グラフでは1つの色しか描画されません。誰も私を助けることができますか？

グラフ：

enter code here 
    // CREATE A COLOR SCALE 
var color = d3.scale.ordinal() 
    .domain(['1','2','3']) 
    .range(['red','blue','green']) 

d3.csv("wine.csv", function(error, wine) { 

    // Extract the list of dimensions and create a scale for each. 
    x.domain(dimensions = d3.keys(wine[0]).filter(function(d) { 
    return d != "name" && (y[d] = d3.scale.linear() 
     .domain(d3.extent(wine, function(p) { return +p[d]; })) 
     .range([h, 0])); 
    })); 

    // Add grey background lines for context. 
    background = svg.append("g") 
     .attr("class", "background") 
    .selectAll("path") 
     .data(wine) 
    .enter().append("path") 
     .attr("d", path); 

    // USE THE COLOR SCALE TO SET THE STROKE BASED ON THE DATA 
    foreground = svg.append("g") 
     .attr("class", "foreground") 
    .selectAll("path") 
     .data(wine) 
    .enter().append("path") 
     .attr("d", path) 
     .attr("stroke", function(d) { 
     var species = d.name.slice(0,d.name.indexOf(' ')); 
     return color(species); 
     }) 

Answer 1

すでに定義されdomainとrangeと色のあなたの順序尺度を持っていたら、あなただけd.nameに応じて、あなたのラインを着色する必要があります。

.attr("stroke", function(d) { 
    return color(d.name); 
    });