<!DOCTYPE html>
<html>
  <head>
    <script src="https://d3js.org/d3.v4.min.js"></script>
  </head>
  <body>
    <svg></svg>
    <script>
      var dataList = [4,5,4];
      var svg = d3.select("svg");
      
      svg.attr("width" ,"500px")
         .attr("height","200px")
         .style("background-color","lightgrey");
         
      svg.selectAll("circle")
         .data(dataList)
         .enter()
             .append("circle")
             .attr("cy","100")
             .attr("cx",function(d,i){return (i+1)*120;})
             .attr("r",function(d){return d*10;})
             .style("fill","blue");
      
    </script>
  </body>
</html>
// Code goes here

/* Styles go here */