Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
1
respuesta

Ejemplo de la cara de Creeper

<canvas width="600" height="400"></canvas>
    <script>
        var pantalla = document.querySelector("canvas")
        var pincel = pantalla.getContext("2d");
        pincel.fillStyle = "green";
        pincel.fillRect(0,0,350,300)//cabeza
        pincel.fillStyle = "black";
        pincel.fillRect(50,60,90,90)//ojos
        pincel.fillStyle = "black";
        pincel.fillRect(210,60,90,90)//ojos
        pincel.fillStyle = "black";
        pincel.fillRect(140,150,70,100)//nariz
        pincel.fillStyle = "black";
        pincel.fillRect(100,190,40,110)//parte de la boca
        pincel.fillStyle = "black";
        pincel.fillRect(210,190,40,110);//parte de la boca
    </script>

Salida del código anterior

1 respuesta

¡Hola Mauro!

El código que publicaste es un ejemplo de cómo dibujar la cara de Creeper en un canvas utilizando JavaScript. La función getContext() es utilizada para obtener el contexto de dibujo en 2D del canvas y la función fillRect() es utilizada para dibujar rectángulos en el canvas.

En este caso, se dibuja la cabeza de Creeper con un rectángulo verde y se dibujan los ojos, nariz y boca con rectángulos negros. El código es bastante sencillo y fácil de entender.

Si deseas aprender más sobre cómo dibujar en canvas utilizando JavaScript, te recomiendo que revises la documentación oficial de MDN sobre el tema.

¡Espero haber ayudado y buenos estudios!

Si este post te ayudó, por favor, marca como solucionado ✓. Continúa con tus estudios! :)