D3 - Animation and Transition

<html>
 <head>
  <title>D3 - Animation and Transition</title>
  <script type="text/javascript" src="https://d3js.org/d3.v3.min.js"></script>
   <style>
     line {
       stroke: rgb(238, 238, 238);
     }
     path {
       stroke: rgb(0, 0, 255);
    		stroke-width: 2px;
    		fill: none;
     }
   </style>
 </head>
 <body>
  <script type="text/javascript">
    var w = 944;
		var h = 400;
		var dataset = [ 5, 10, 13, 19, 21, 25, 22, 18, 15, 13, 
                   11, 12, 15, 20, 18, 17, 16, 18, 23, 25 ];
    
    var yScale = h / d3.max(dataset);
    var xdiff = w / dataset.length;
    var i = 0;
    var d = "m ";
    dataset.forEach(function(y) {
      d += (i*xdiff) + "," + (h-y*yScale) + " L ";
      i++;
    })
    
    var svg = d3.select("body")
              .append("svg")
              .attr("width", w)
              .attr("height", h);
    
    for(x=0; x<dataset.length; x++) {
      svg.append("line")
        .attr("x1", x*xdiff)
      	.attr("x2", x*xdiff)
      	.attr("y1", 0)
      	.attr("y2", h)
    }
    
    var yInterval = 40;
    for(y=0; y<h/yInterval; y++) {
      svg.append("line")
        .attr("x1", 0)
      	.attr("x2", w)
      	.attr("y1", y*yInterval)
      	.attr("y2", y*yInterval)
    }
    
    svg.append("path")
      .attr("d", function(s) {
      	return d;
    	})
  </script>
 </body>
</html>

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

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