如何在创建新正方形之前删除正方形?

时间:2019-01-15 09:13:45

标签: javascript animation canvas kill tweenmax

当我单击按钮时,它有一个内瓣,它会创建一个新的正方形,但是我需要解决方案,如何从画布中删除以前的正方形。

https://codepen.io/mejs/pen/MZLzog?editors=1011&fbclid=IwAR2C5eV1fiHOj1DaaApaWQWLZzCO_Hn59yg3AkjgKsP0bgZdUjoANdSCcC0

    function activeDep(){
    let x1,x2,y1,y2;
    const currentDepPos = document.getElementById('showRect').getContext('2d');

    x1 = x2 = random(10,200);
    y1 = y2 = random(10,200);
    //console.log(`x: ${x1}, y: ${y1}`);

    tweenToRandomColor(x1,x2);

   function updateColor(x,y) {
    currentDepPos.rect(x,y,40,40);
    currentDepPos.fill();
   }

   function random(min, max) {
    return (min + Math.random() * (max - min) + 0.5) | 0;
   }

   function tweenToRandomColor(x,y) {
        //tweenToRandomColor.kill();
    TweenLite.to(currentDepPos, 1, {
        colorProps: {
        fillStyle: "rgb(" + random(0, 255) + "," + random(0, 255) + "," + random(0, 255) + ")"
    },
    onUpdate: updateColor(x1,y1),
    onComplete: function(){
            tweenToRandomColor(x1,y1);
        }
    });
   }
}

0 个答案:

没有答案