有沒有辦法在畫布上縮放繪圖元素?我正在創建一個應用程序,然后用戶可以在畫布上放置點,但是當我嘗試調整瀏覽器窗口的大小時,所有元素都消失了。我最初的嘗試是計算調整大小前后的屏幕差異。得到百分比后,我只是將比例尺放在畫布上,并將第一次繪制時保存的坐標放置在畫布上,但仍然不起作用,如果點出現在畫布上,則是在畫布上沒有縮放的同一個地方。有人可以給我一點思路嗎?private calculateCanvasScreenDifference(previousSize, guestScreen) { return ((controlScreen - currentSize) * 100) / controlScreen;}let difWidthPercent = Math.abs(this.calculateCanvasScreenDifference(canvasPreviousWidth, canvasWidth) * 0.01);let difHeightPercent = Math.abs(this.calculateCanvasScreenDifference(canvasPreviousHeight, canvasHeight) * 0.01); let scaleX = ((Math.abs(difWidthPercent) <= 1) ? 1.00 - difWidthPercent : difWidthPercent - 1.00);let scaleY = ((Math.abs(difHeightPercent) <= 1) ? 1.00 - difHeightPercent : difHeightPercent - 1.00);this.cx.scale(Number(scaleX), Number(scaleY));......// then start recreating the drawing that was previous saved on an array of object(x, y values)this.cx.beginPath();this.cx.arc(coord.x, coord.y, 7, 0, Math.PI * 2, true);this.cx.stroke();
在 html 畫布上縮放鼠標繪圖元素
飲歌長嘯
2021-09-04 17:53:09