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
2
respuestas

[Proyecto] 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 BenjamínNájeraEspinosa
| 91k xp | 33 posts

aquí esta mi creeper por si les sirve, el canvas no es el solicitado, ya que eso viene hacta el final y yo lo fui haciendo paso a paso hahaha

<canvas width="350" height="300">

</canvas>

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

pincel.fillStyle="green"//propiedad
pincel.fillRect(0,0,350,300);//funcion

pincel.fillStyle="black"//propiedad
pincel.fillRect(50,60,90,90);//funcion
pincel.fillRect(210,60,90,90);//funcion
pincel.fillRect(140,150,70,100);//funcion
pincel.fillRect(210,200,40, 110)
pincel.fillRect(100,200,40, 110)


</script>
2 respuestas
por Axel Israel Martinez Adan
| 91.5k xp | 49 posts
<script>
    // Obtener el canvas y el contexto del dibujo
    var canvas = document.getElementById("myCanvas");
    var ctx = canvas.getContext("2d");

    // Rectángulo 1 (cabeza)
    ctx.fillStyle = "darkgreen";
    ctx.fillRect(350, 300, 90, 90);

    // Rectángulos 2 y 3 (ojos)
    ctx.fillStyle = "black";
    ctx.fillRect(90, 90, 90, 90);
    ctx.fillRect(420, 90, 90, 90);

    // Rectángulo 4 (nariz)
    ctx.fillStyle = "darkgreen";
    ctx.fillRect(265, 155, 70, 100);

    // Rectángulos 5 y 6 (parte de la boca)
    ctx.fillStyle = "black";
    ctx.fillRect(250, 265, 40, 110);
    ctx.fillRect(360, 265, 40, 110);
</script>
por José Manuel Díaz Bahena
| 106.9k xp | 19 posts
CHOFER LOGISTA

//yo lo hice con funciones, aun no me acostumbro a comentar