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

Ya que va, que vuelva!

Referente al curso Lógica de programación: Practicando con juegos y animaciones, en el capítulo Moviendo elementos con animaciones simples y actividad ¡Ya que va, que vuelva!

por Agustín Eduardo Brambilla
| 67.9k xp | 45 posts

Buenos días, porque mi código no funciona?

<!DOCTYPE html>
<meta charset="UTF-8">

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

<script>
    var pantalla = document.querySelector("canvas");
    var pincel = pantalla.getContext("2d");        
    pincel.fillStyle = "lightgrey";
    pincel.fillRect(0,0,600,400); 

    function disenharCircunferencia(x,y,radio){
        pincel.fillStyle = "blue";
        pincel.beginPath();
        pincel.arc(x,y,radio,0,2*Math.PI);
        pincel.fill();
    }    

    function limpiarPantalla(){

        pincel.clearRect(0,0,600,400);

    }

    var x = 0

    function actualizarPantalla(){
        limpiarPantalla();
        if(x > 600) {          
            x = x - 1;           
        } else if(x < 0) {         
            x = x + 1;       
        }
         disenharCircunferencia(x,20,10);
    }

    setInterval(actualizarPantalla,1);
</script>
2 respuestas
por Cesar Andre Chavez Herrera
| 18.3k xp | 1 posts

hola mira eel problema que tienes es un problema mas que todo de la logica function actualizarPantalla(){ limpiarPantalla(); if(x < 600) { x = x - 1; } else if(x > 0) { x = x + 1; } disenharCircunferencia(x,20,10); }

lo que esta sucediendo aque es que esta preguntando si ya llego al limite pero cuando ya llego x cambia a restarle pero al evaluar nuevamente no esta al limite asi que le suma 1:

frame 1 x = 600 se dibuja circulo en x -1 = 599

frame 2 x = 599 se cumple condision se dibuja circulo en x +1

una de l soluciones simplemente añadir lo que es una variable adicional que almacene la direccion

var x = 0 var direccion = 1 function actualizarPantalla(){

    limpiarPantalla();
    disenharCircunferencia(x,20,10);
    if (x > 600 && direccion == 1){
        direccion = -1
    }
    if (x < 0 && direccion == 1){
        direccion = 1
    }
    x = direccion+x

}

como se evalua si se x ya llego a los bordes y si la direccion es diferente entonces asi controlaras hacia donde ir

por Agustín Eduardo Brambilla
| 67.9k xp | 45 posts

Hola César, no termino de entender, no se puede hacer el código sin añadir una variable adicional que almacene la dirección? Si no se puede, porque?