我正在使用HTML5和JavaScript在画布上实现绘图。
如果我不手动设置画布的宽度和高度(保留默认值),我的绘图效果良好。
然而,当我从CSS或JavaScript设置画布大小时,我的绘图看起来很扭曲。线条离线条稍微有点距离,并且看起来扭曲。
以下是mousedown事件的代码。
如果我不手动设置画布的宽度和高度(保留默认值),我的绘图效果良好。
然而,当我从CSS或JavaScript设置画布大小时,我的绘图看起来很扭曲。线条离线条稍微有点距离,并且看起来扭曲。
以下是mousedown事件的代码。
![Distorted image](https://istack.dev59.com/2uIpF.webp)
if (mouseDown)
{
previousX = currentX;
previousY = currentY;
currentX = e.clientX - canvas.offsetLeft;
currentY = e.clientY - canvas.offsetTop;
ctx.beginPath();
ctx.moveTo(previousX, previousY);
ctx.lineTo(currentX, currentY);
ctx.strokeStyle = color;
ctx.lineWidth = y;
ctx.stroke();
ctx.closePath();
}