Can someone help me with this code?

Question

So, I wanna do a code which makes a new circle as each second pass...

function draw() {
cc.beginPath()
cc.fillStyle=color
cc.arc(x,y,w,h, Math.PI*2, true)
cc.fill()
cc.closePath()
}
setInterval(draw, 1000);

But instead of saving each circle I do (x, y, w, h are changed after each interval, but not gonna say value because it will spoil my new code), it draws the circle I want, after a second, the circle is deleted and a new one is drawn on the values... How can I save previous circles?

Answer 1

I'm no expert but the code seems to work fine.
Here's what I tried:
window.onload =function(){
x=20
y=20
w=20
h=20
c= document.getElementById("c");
cc=c.getContext("2d");
setInterval(draw, 1000);
}
function draw() {
cc.beginPath()
cc.fillStyle="red"
cc.arc(x,y,w,h, Math.PI*2, true)
cc.fill()
cc.closePath()
x+=20;
y+=20;
w+=20;
h+=20;
}

Answer 2

Hm, yeah, I haven't thought about that. A silly mistake ruined my code.

Answer 3

Oh, don t worry, I got it right now.... I set a rectangle which makes the background black, but it is always defined before in draw so this is why just some where visible. Thanks anyways Jafca

Answer 4

Why not make the background black in CSS or HTML?
body {
background-color:black;
}