Здравствуйте. Надо нарисовать с помощью Canvas и JavaScript анимацию падающего примитива. Так вот. Как сделать так, чтобы он не оставлял предыдущее состояние?
Фрагмент кода
var ctx = document.querySelector("canvas").getContext('2d');
ctx.lineWidth = 2;
function draw()
{
var y = 0;
function frame()
{
ctx.beginPath();
ctx.arc(100, 100+y, 20, 0, 2*3.14);
ctx.stroke();
ctx.fill();
ctx.closePath();
y+=5;
if (y >= 100) clearTimeout(timer);
}
var timer = setInterval(frame, 50);
}
draw();
<canvas width=200 height=200>
</canvas>
Могу предоставить весь код, если надо. То, что получилось:
setInterval
...clearTimeout
- баг.ctx.save(); ctx.restore()
?