javascript - generation of lines is not shown, attribute d of the path is empty

Question

I'm trying to create lines that connect and generate an animation. I have an array of 2 positions, in each position of the array I want to generate a line from those points.

but my problem is that they are not generating, the attribute d of the path appears empty, that I am doing wrong?

this is my current code: http://jsfiddle.net/6vhved46/

I made a modification to my original code which was this.

http://jsfiddle.net/syckujd8/

I changed the structure of the dataset variable on this occasion.

  var svg = d3.select('svg');

  var backLayer = svg.append("g");

  var dataSet=[
    [
      { "voltaje":  Math.random() * 30 + 10, "corriente": Math.random() * 130 + 10},
      { "voltaje":  Math.random() * 30 + 10, "corriente": Math.random() * 130 + 10},
      { "voltaje":  Math.random() * 30 + 10, "corriente": Math.random() * 130 + 10}
    ],
     [
      { "voltaje":  Math.random() * 30 + 10, "corriente": Math.random() * 130 + 10},
      { "voltaje":  Math.random() * 30 + 10, "corriente": Math.random() * 130 + 10},
      { "voltaje":  Math.random() * 30 + 10, "corriente": Math.random() * 130 + 10},
      { "voltaje":  Math.random() * 30 + 10, "corriente": Math.random() * 130 + 10}

    ]
  ];
  console.log(dataSet);

  var lineGenerator = d3.svg.line()
    .x(function(d) {
      return d.corriente
    })
    .y(function(d) {
      return d.voltaje
    })
    .interpolate("monotone")

  function displayLine(data) {
    var line = backLayer.selectAll(null)
      .data(data)
      .enter()
      .append("path")
      .attr("d",function(d){
        lineGenerator(d)
      })
      .attr("fill",'none')
      .attr("stroke","red")
      .attr("stroke-width","1px")
      .attr("class","linea1");


    var totalLength = line.node().getTotalLength();

    line.attr("stroke-dasharray", totalLength + " " + totalLength)
      .attr("stroke-dashoffset", totalLength)
      .transition()
      .duration(2000)
      .ease("linear")
      .attr("stroke-dashoffset", 0);
  }

  displayLine(dataSet)

Answer 1

Waitting for answers