问题出在handleLineEnd函数中。我撕掉了所有不需要显示问题的线条。
没有这条线:我可以在 ctx 上绘制多个矩形。
使用该线:每个矩形都会被下一个矩形覆盖。
该代码在旧版 Chrome (118.0.5993.71) 中运行良好,而在版本 119.0.6045.106 中则无法运行
function handleLineEnd(evt) {
{
startDrawing = false;
var dummy = ctx.getImageData(3, 3, 5, 5); // problem line
ctx.drawImage(canvaslayer, 0, 0);
ctxlayer.clearRect(0, 0, el.width, el.height);
}
}
Run Code Online (Sandbox Code Playgroud)
function handleLineEnd(evt) {
{
startDrawing = false;
var dummy = ctx.getImageData(3, 3, 5, 5); // problem line
ctx.drawImage(canvaslayer, 0, 0);
ctxlayer.clearRect(0, 0, el.width, el.height);
}
}
Run Code Online (Sandbox Code Playgroud)
var el = document.getElementById("canvasID");
var elcontainer = document.getElementById("containerID");
var ctx = el.getContext('2d');
var startpuntX, startpuntY, …Run Code Online (Sandbox Code Playgroud)