So I need to call the data again?

A tale of doubt and confusion from the d3 mailing list.

var svg = d3.select("body")
  .append("svg")
  .attr("width", 960)
  .attr("height", 500)
  .append("g")
  .attr("transform", "translate(180,200)")

d3.text("poem", function(poem) {
  var data = poem.split("\n");
  var lines = svg.selectAll("text")
    .data(data)
    .enter().append("text")
    .text(String)
    .attr("x", function(d,i) { return 4*(i-currentLine); })
    .attr("y", function(d,i) { return 24*(i+1); })
    .style("opacity", function(d,i) { return 1/Math.pow((i+1),1.2); })
    .attr("transform", function(d,i) { return "rotate(" + Math.pow(i-currentLine,2)/10 + ")" })

setInterval(rollText, 1120);

function rollText() {
    currentLine++;

svg.transition()
       .duration(1120)
       .ease("linear")
       .attr("transform", "translate(180," + (200-(24*currentLine)) + ")");

lines.transition()
       .duration(700)
       .ease("sin")
       .style("opacity", function(d,i) { return 1/Math.pow((Math.abs(currentLine-i)+1),1.2); })
       .attr("transform", function(d,i) { return "rotate(" + Math.pow(i-currentLine,2)/10 + ")" })
       .attr("x", function(d,i) { return 4*(i-currentLine); })
  };
});
</script>
<style>
svg {
  height: 800px;
}
svg text {
  font-size: 16px;
  font-family: Helvetica, Arial, sans-serif;
}
</style>

Modified http://d3js.org/d3.v3.min.js to a secure url

https://d3js.org/d3.v3.min.js