D3 Examples - Bahamas Flag

xxxxxxxxxx
 
<!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 canvas = d3.select("body")
                                    .append("svg")
                                    .attr("x", 1000)
                                    .attr("y", 1000)
                                    .append("g");
    
    var blue =  canvas.append("rect")
                                        .attr("x", 50)
                                        .attr("y", 50)
                                        .attr("height", 300)
                                        .attr("width", 600)
                                        .style("fill", "#33cccc")
    
    var yellowstripe =  canvas.append("rect")
                                                        .attr("x", 50)
                                                        .attr("y", 150)
                                                        .attr("height", 100)
                                                        .attr("width", 600)
                                                        .style("fill", "yellow")
    
    
    
    
    
    
    var blacktri = [{"x": 50.0, "y": 50.0},
                    {"x": 300.0, "y": 150.0},
                    {"x": 50.0, "y": 300.0}];
    
    
   
                                            
                   
    var triangle = canvas.append("polygon")
            .attr("points", "50, 50  300, 200  50, 350")
            .style("stroke-width", 2)
            .style("stroke", "black")
            .style("fill", "black");
                                                
            
                                            
                                                
                                                
    
    
    
    
  </script>
</body>
​
    