Suprise! It's a Bar Chart!

<!DOCTYPE html>
<head>
  <meta charset="utf-8">

  <script src="https://d3js.org/d3.v4.min.js"></script>
  <style>
    body { margin:0;position:fixed;top:0;right:0;bottom:0;left:0; }
  </style>
</head>

<body>
  <script>
//Let's give the code some data, on line 14!
    var dataset = [50,100,150];
//Now let's change the D3 code to display something different, not just numbers. Append an svg element rectangle for every piece of data in the dataset.'.attr()'is an attribute. 
    var svg=d3.select("body").append("svg")
    svg.attr("height","600");
    
   	svg.selectAll("rect")
    	.data(dataset)
    	.enter()
    	.append("rect")
    	.attr("y",function(d) {return 150-d;})
    	.attr("width",25)
    	.attr("height", function(d) {return d;})
    	.attr("fill", "green")
    	.attr("x", function(d) {return d;})
//Appends a rectangle (line 19) at the y coordinate **(line 20). The width of the bar is 25 pixels (line 24) and the height is given by the dataset (line 25). Make it green on line 26 and line 27 gives you the coordinate on the X axis for the bar. Line 20 requires some more explanation--without setting the y coordinate to '150-d', the bars align at the top of the SVG space. 150-d is 150-height of the bar, and aligns the bars to the bottom.

</script>
</body>

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