颜色编码平行坐标

Question

我已经有一个代码并行坐标图，一切正常。现在我正在尝试使用颜色对并行坐标可视化进行颜色编码，但是出了点问题。在数据集（http://archive.ics.uci.edu/ml/machine-learning-databases/wine/wine.data）中，我有不同的葡萄酒种类名称（第一列是类标识符（1-3）），但在图表中只绘制一种颜色。有人能帮助我吗？

图表：

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);
  });