clearRect不清除画布中的任何内容

Question

My code below is for Chris Courses "Circular Motion" tutorial, but I can't figure out why my clearRect isn't working. It's got to be something I'm just not seeing, I have two other canvas animations working now, but this one wont clear the rect and it's driving me nuts....

Thanks for anyone who has the time to help!

 function spirals() { const canvas2 = document.getElementById('mycanvas'); canvas2.width = document.getElementById('mycanvas').scrollWidth; canvas2.height = document.getElementById('mycanvas').scrollHeight; const c2 = canvas2.getContext('2d'); const spiralColorArray = [ '#ff0000', '#00ff00', '#0000ff' ]; addEventListener('resize', () => { canvas2.width = document.getElementById('mycanvas').scrollWidth; canvas2.height = document.getElementById('mycanvas').scrollHeight; init(); }); function SpinnerIcon(h, v, radius, color) { this.h = h; this.v = v; this.color = color; this.radius = radius; this.update = () => { this.h += 1; this.draw(); }; this.draw = () => { c2.beginPath; c2.arc(this.h, this.v, this.radius, 0, Math.PI*2, false); c2.fillStyle = this.color; c2.fill(); c2.closePath(); } } function init() { spinnerArray = []; for(let i=0; i < 1; i++) { spinnerArray.push(new SpinnerIcon(canvas2.width/2, canvas2.height/2, 5, 'red')) } } let spinnerArray; function animate() { requestAnimationFrame(animate); c2.clearRect(0, 0, canvas2.width, canvas2.height); spinnerArray.forEach(parti => { parti.update(); }) } init(); animate(); } spirals(); 

 #mycanvas { background: blue; } 

 <canvas id="mycanvas" width="500" height="500"> 

Answer 1

Your line with c2.beginPath is missing () and should be c2.beginPath(); since it's a function. clearPath won't work when beginPath isn't called.