Here's one possible solution. First, use a d3.csv .row to organize the data into an object of key: [values] where key is your x, y and z and values is an array of val1, val2, ...

  .row(function(d) {
    return {
      key: d.Name,
      values: [+d.val1, +d.val2, +d.val3, +d.val4]
  .get(function(error, data) {
     // draw plot

Then your line generator is simply:

    var line = d3.svg.line()
      .x(function(d,i) { return rangeX(slots[i]); })
      .y(function(d,i) { return rangeY(d); });

And you draw each line as:

    var g = p.selectAll(".lineGroup")
      .attr("class", "lineGroup"); 

      .attr("class", "line")
      .attr("d", function(d) {
        return line(d.values);
      .style("stroke", function(d,i) {
        return color(i);

Here's an example.

Related Query

More Query from same tag