How to move circle in canvas

Answer 1

@abdul raahman

Your link doesn't work. It just gives an error.

See this for moving circles:
https://code.sololearn.com/W771S9eYuP9c/#html

Answer 2

Use JS.

Answer 3

like this, inside the main loop.

context.arc(posx+dirx, posy+diry, 50, 0, 2 * Math.PI);

Answer 4

Give me an example

Answer 5

elipse function have x and y as the parameter, you can play around with both of this parameter to change its location while redrawing.

Answer 6

I don't think you can without putting white over the first one

Answer 7

Js

Answer 8

you dont need to use set timeout (its should be setinverval btw) in a loop. use requestAnimationFrame instead, it'll let the browser handle the animating part.
you'll also need to clear the canvas before drawing the next frame.

function move(){
ctx.clearRect(0,0,canvas.width,canvas.height); //this will clear the canvas.
// draw other things here
requestAnimationFrame(move);
}

requestAnimationFrame(move); // replacing your loop and setTimeout