1. 1) Move the sun to the upper left-hand corner of the canvas

2. 2) Add three circles to the umbrella that are a different color from the umbrella.

3. 3) Display your name in the upper right corner of the canvas

   4) Add a sandcastle somewhere on the beach that is shaped like the one shown in the

4. screenshot below. Hint: use strokeRect(x,y,w,h) to outline the castle.

   my js

   let canvas = document.getElementById("myCanvas");
   let ctx = canvas.getContext("2d");

   
   

   const width = 800;
   const height = 500;
   const MID = width / 2;
   const GROUND = 400;

   
   

   ctx.fillStyle = "cyan";
   ctx.fillRect(0, 0, width, height); //sky background

   
   

   ctx.fillStyle = "lightyellow";
   ctx.fillRect(0, GROUND, width, 100); // ground

   
   

   ctx.fillStyle = "yellow";
   ctx.beginPath();
   ctx.arc(width+10, -10, 80, 0, 2 * Math.PI); //sun
   ctx.fill();

   
   

   ctx.fillStyle = "DarkOrange";
   ctx.beginPath();
   ctx.arc(MID, GROUND - 150, 150, Math.PI, 2 * Math.PI); // umbrella
   ctx.fill();

   
   

   ctx.beginPath();
   ctx.fillStyle = "darkgray";
   ctx.fillRect(MID, GROUND-150, 10, 200); // umbrella
   ctx.fill();

   
   

   ctx.font = "30px Georgia";
   ctx.fillStyle = "black"
   ctx.strokeText("my name", 10, 50);

ne ex7.html >html