Postin työntekijät

<!DOCTYPE html>
<head>
  <meta charset="utf-8">
  <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js"></script>
  <style>
    body { margin:0;position:fixed;top:0;right:0;bottom:0;left:0; }
    svg { width:100%; height: 100% }
  </style>
</head>

<body>
  <script>
    var margin = {top: 30, right: 20, bottom: 30, left: 30},
      w = 1200 - margin.left - margin.right
      h = 1200 - margin.top - margin.bottom;
var svg = d3.select("body")
  .append("svg")
  .attr("width", w + margin.left + margin.right)
  .attr("height", h + margin.top + margin.bottom)
  .append("g")
  .attr("transform", "translate(" + margin.left + "," + margin.top + ")");
    var rW = 3;
    var rH = 3;
    var padding = 2;
    
    var round_up = function(x,factor){ return x - (x%factor) + (x%factor>0 && factor);}

for (i = 0; i<21000; i++) {
    
    // Feel free to change or delete any of the code you see!
    svg.append("rect")
        .attr("x", function() { return i%200 * rW * padding;  })
    	.attr("y", function() { return Math.floor(i/200)*rW*padding;  })
    	.attr("height", rW)
    	.attr("width", rH)
    	.attr("fill", function() { if (i < 861) { return "black"; }
                               else { return "orange"}} );
      
      }

console.log("you are now rocking with d3", d3);
  </script>
</body>

https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js