D3 Examples - [unlisted] Logo

xxxxxxxxxx
 
<!DOCTYPE html>
<html>
  <head>
    <title>Rendering Rectangles</title>
    <script src="https://d3js.org/d3.v4.min.js"></script>
  </head>
  <body>
    <svg width="960" height="500"></svg>
    <script>
      const svg = d3.select("svg");
      
      function render(data){
        svg.selectAll("rect").data(data)
          .enter().append("rect")
            .attr("x", (d, i) => i * 30)
            .attr("y", (d, i) => i * 30)
            .attr("width", (d, i) => i * 30)
            .attr("height", (d, i) => i * 30)
      }
      
      function type(d){
        d.population = +d.population;
        return d;
      }
      
      d3.csv("data.csv", type, render);
    </script>
  </body>
</html>
    