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

Popular posts from this blog

jQuery clickable div with working mailto link inside -

WPF: binding viewmodel property of type DateTime to Calendar inside ItemsControl -

java - Getting corefrences with Standard corenlp package -