S2JS - Introduction to drawing on the canvas : More rectangles

Let's draw two rectangles, of slightly different dimensions and in different places.

Again, be adventurous and change things around.

Try to make a third rectangle somewhere else on the canvas.

(But if you end up with one rectangle right on top of another, you won't see it)

<HTML> <head> <title> My new Web Page </title> </head> <body> <canvas id=myCanvas width=300 height=300 style="background-color: pink"> </canvas> <script> var ctx = myCanvas.getContext("2d"); // Draw a fill rectange, starting top left x and y, for a width and height ctx.fillRect(10, 10, 20, 20); ctx.fillRect(50, 50, 20, 40); </script> </body> </html>