JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <div id="line"></div>

JavaScript

var w = 900,
      h = 400;

      var svg = d3.select("#line")
      .append("svg")
      .attr("width", w)
      .attr("height", h)
      .attr("id", "visualization");

      var lineData = 
[[{ "x": 1, "y": 300}, { "x": 200,  "y":70}, { "x": 450,  "y": 300}],
 [{ "x": 1, "y": 300}, { "x": 250,  "y":70}, { "x": 550,  "y": 300}],
[{ "x": 1, "y": 300}, { "x": 300,  "y":70}, { "x": 620,  "y": 300}],
[{ "x": 1, "y": 300}, { "x": 350,  "y":70}, { "x": 720,  "y": 300}]];

      for (var i = 0; i < 1; i++) {
        lineData.push([{ "x": 1, "y": 300}, { "x": 280,  "y":70}, { "x": 580,  "y": 300}]);
      };

      var line = d3.svg.line()
      .x(function(d) { return d.x; })
      .y(function(d) { return d.y; })
      .interpolate("cardinal")
      .tension(0.1);

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

      group
      .selectAll(".line")
      .data(lineData)
      .enter()
      .append("path")
      .attr("d", line)
      .attr("class", "line")
      .attr("stroke", "steelblue")
      .attr("stroke-width", "2")
      .attr("fill", "none");

      $(".line").each(function(i,d){
        var t = [1100, 1304,4506,8101,10607, 12900],
        bases = ["first", "second", "third", "fourth"];

        var totalLength = d.getTotalLength();

          // Clear any previous transition
          d.style.transition = d.style.WebkitTransition = 'none';

          d3.select(this).attr("stroke-dasharray", totalLength + " " + totalLength)
          .attr("stroke-dashoffset", totalLength)
          .transition()
          .duration(function(d,i) { return t[i]; })
          .ease("linear")
          .attr("stroke-dashoffset", 0)
          .each("end", function() { 
            svg.append("text")
            .attr("class", "t")
            .attr("x", w / 2)
            .attr("y", h)
            .attr("text-anchor", "middle");

            svg.selectAll("text.controltext")
            .data(d3.range(lineData.length))
            .enter().append("text")
            .attr("class",...