一尘不染

clearRect函数不会清除画布

javascript

我在body onmousemove函数上使用此脚本:

function lineDraw() {
    // Get the context and the canvas:
    var canvas = document.getElementById("myCanvas");
    var context = canvas.getContext("2d");
    // Clear the last canvas
    context.clearRect(0, 0, canvas.width, canvas.height);
    // Draw the line:
    context.moveTo(0, 0);
    context.lineTo(event.clientX, event.clientY);
    context.stroke();
}

每次我移动鼠标并画一条新线时,都应该清除画布,但是它不能正常工作。我正在尝试不使用jQuery,鼠标侦听器或类似工具来解决它。


阅读 634

收藏
2020-05-01

共1个答案

一尘不染

您应该使用“ beginPath() ”。这就对了。

function lineDraw() {   
    var canvas=document.getElementById("myCanvas");
    var context=canvas.getContext("2d");
    context.clearRect(0, 0, context.width,context.height);
    context.beginPath();//ADD THIS LINE!<<<<<<<<<<<<<
    context.moveTo(0,0);
    context.lineTo(event.clientX,event.clientY);
    context.stroke();
}
2020-05-01