Drawing Rectangles

    
function draw()
{

    // Targets the canvas element
    var canvas = document.getElementById('mycanvas');
    
    // Checks to see if the browser is compatible
    if (canvas.getContext)
    {
        // Gets canvas context
        var ctx = canvas.getContext('2d');

        // Defines fill color
        ctx.fillStyle = "rgb(153,0,0)";
        
        // Draws a rectangle (x, y, width, height)
        ctx.fillRect (10, 10, 100, 100);
        
        // Defines a new fill color with some transparency
        ctx.fillStyle = "rgba(51, 102, 204, 0.5)";

        // Draws another rectangle
        ctx.fillRect( 50, 50, 100, 100);

    }

}