javascript - How to animate a ball becoming smaller in HTML5 canvas -
i'm trying make ball become increasingly smaller using html5 canvas. i've been able make grow larger, figured reverse simple. doing wrong here? console.log shows me values 11 0 decreasing 1. when x less 0, stops. ball doesn't change shape, , suspect because it's drawing smaller shapes on top of each other, perhaps? thought clearrect work that?
function draw2() { console.log(x); context2d.clearrect(0, 0, canvas.width, canvas.height); context2d.arc(10, 10, x, 0, math.pi * 2, true); context2d.fill(); x -= 1; if (x < 0) { clearinterval(s); } }
a demo available at: http://www.chronicled.org/dev/test.html
thanks!
add context2d.beginpath();
beginning of draw2 (it wouldn't hurt have in draw)
the .fill filling whole path includes old arcs
Comments
Post a Comment