javascript - HTML5 Remove previous drawn object in canvas

Question

I have a polygon object (say a car) drawn inside a HTML5 canvas with help of methods moveTo and lineTo. I want to repeatedly draw that object at different positions in the canvas (simulating a moving object). My problem is that the previous drawn object is not getting cleared. Instead, multiple images are drawn on the canvas. How can I fix this issue?

Answer 1

You have to clear the canvas at the start of every draw frame

context.clearRect(0, 0, canvas.width, canvas.height);