Entrar ¿Aún no tienes acceso?
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
1
respuesta

CREEPER

Referente al curso Lógica de programación: Practicando con juegos y animaciones, en el capítulo Diseñando gráficos con Canvas y actividad La cara de Creeper

por José Bautista Berrios Scarpellino
| 30.8k xp | 40 posts
<canvas width="350" height="300">

</canvas>

<script>

    var pantalla = document.querySelector("canvas");
    var pincel = pantalla.getContext("2d");

    pincel.fillStyle = "darkgreen";
    pincel.fillRect(0,0,350,300);

    pincel.fillStyle = "black";
    pincel.fillRect(50,60,90,90);

    pincel.fillStyle = "black";
    pincel.fillRect(210,60,90,90);

    pincel.fillStyle = "black";
    pincel.fillRect(140,150,70,100);

    pincel.fillStyle = "black";
    pincel.fillRect(100,200,40,100);

    pincel.fillStyle = "black";
    pincel.fillRect(210,200,40,100);

</script>
1 respuesta
por Julio Carlos Bernaola Lozano
| 26.9k xp | 36 posts

Te comparto mi código, compañero. Solo debes corregir el width = "600" y el height = "400" ya que así estaba dispuesto en el ejercicio, pero eso no quita que lo hiciste bien.

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

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

    pincel.fillStyle = "darkgreen"; //cabeza
    pincel.fillRect(0,0,350,300)

    pincel.fillStyle = "black"; //ojos
    pincel.fillRect(50,50,90,90)
    pincel.fillRect(210,50,90,90)

    pincel.fillStyle = "black"; //nariz
    pincel.fillRect(140,140,70,100)

    pincel.fillStyle = "black"; //partes boca
    pincel.fillRect(100,190,40,110)
    pincel.fillRect(210,190,40,110)
</script>