1 回答

TA貢獻1836條經驗 獲得超5個贊
只需調用ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);,同樣,調用時stroke,您需要先調用ctx.beginPath(),所有這些:
var canvas = document.getElementById("DemoCanvas");
var ctx = canvas.getContext("2d");
class Drop{
constructor(){
this.x = canvas.width / 2;
this.y = 0;
this.yspeed = 10;
}
fall(){
this.y = this.y + this.yspeed;
}
show(){
ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height)
ctx.beginPath()
ctx.moveTo(this.x, this.y);
ctx.lineTo(this.x, this.y+10);
ctx.stroke();
}
}
if (canvas.getContext) {
let d = new Drop();
setInterval(()=>{
d.show();
d.fall();
},500);
}
<body>
<canvas id="DemoCanvas" width="1400" height="1400"></canvas>
</body>
添加回答
舉報