Lo hecho en clase

Diculpen mi desorden que haci tomo las notas por linea para que sea mas espesifico para mi. Tengan lindo día y si tienen algún consejo siempre sera bien recibido.

<canvas width="600" height="400">  </canvas>

<script>
    let pantalla = document.querySelector("canvas");
    let pincel = pantalla.getContext("2d");


    pincel.fillStyle = "lightgray"; //propiedad (color)
    pincel.fillRect(0,0,600,400);  //funcion (rellenar rectangulo)

    pincel.fillStyle = "green";  
    pincel.fillRect(0,0,200,400);   //eje "x" ↔, eje "y" ↕

    pincel.fillStyle = "red";
    pincel.fillRect(400,0,200,400);   //eje "x" ↔, eje "y" ↕

    pincel.fillStyle = "yellow";   //inicio del triangulo
    pincel.beginPath();     //comienzo del recorrido
    pincel.moveTo(300,200); //pincel muevete a..
    pincel.lineTo(200,400); //dibuja una linea de "p1" a "p2"
    pincel.lineTo(400,400); //dubuja una linea de "p1" a "p2"
    pincel.fill();          //rellena

    pincel.fillStyle = "blue";
    pincel.beginPath(); ////comienzo del recorrido
    pincel.arc(300,200,50,0,2*3.14); //Trasa un circulo, posicion inicial(D1,D2), radio del circulo(D3), angulo inicial(D4), angulo final(D5,2*3.14)
    pincel.fill();

    //p=posicion D=dato

</script>