D3 Examples - making squares with a function

xxxxxxxxxx
 
<!DOCTYPE html>
<meta charset="utf-8">
<script src="https://d3js.org/d3.v3.min.js"></script>
<script type="text/javascript">
​
window.onload=function(){
    
​
var svg = 
  d3.select('body')
    .append('svg')
    .attr('height',400)
    .attr('width',400);
​
svg
    .append('rect')
    .attr('height',300)
    .attr('width',300)    
    .attr('x',0)
    .attr('y',0)    
    .style('fill','red');    
​
​
var square = function(offset,s,color,rectobj){
    rectobj
    .attr('x',offset)
    .attr('y',offset)
    .attr('height',s)
    .attr('width',s)
    .style('fill',color);
};
​
rect2 = svg.append('rect');
square(50,300,'orange',rect2);
​
rect3 = svg.append('rect');
square(100,100,'#3344ee',rect3);
​
rect4 = svg.append('rect');
square(200,200,'rgba(200,0,200,0.5)',rect4);
​
};
</script>
    