diff options
| -rw-r--r-- | src/client/views/nodes/imageEditor/ImageEditor.tsx | 20 |
1 files changed, 6 insertions, 14 deletions
diff --git a/src/client/views/nodes/imageEditor/ImageEditor.tsx b/src/client/views/nodes/imageEditor/ImageEditor.tsx index 5c7e09645..5c4c83eef 100644 --- a/src/client/views/nodes/imageEditor/ImageEditor.tsx +++ b/src/client/views/nodes/imageEditor/ImageEditor.tsx @@ -451,21 +451,13 @@ const ImageEditor = ({ imageEditorOpen, imageEditorSource, imageRootDoc, addDoc const croppedCanvas = document.createElement('canvas'); const croppedCtx = croppedCanvas.getContext('2d'); if (!croppedCtx) return image; - croppedCanvas.width = maxX - minX; - croppedCanvas.height = maxY - minY; + const cropWidth = Math.abs(maxX - minX); + const cropHeight = Math.abs(maxY - minY); + croppedCanvas.width = cropWidth; + croppedCanvas.height = cropHeight; croppedCtx.globalCompositeOperation = 'source-over'; - croppedCtx.clearRect(0, 0, croppedCanvas.width, croppedCanvas.height); - croppedCtx.drawImage( - image, - minX, - minY, - maxX - minX, - maxY - minY, // Source image crop area - 0, - 0, - maxX - minX, - maxY - minY // Destination area on the canvas - ); + croppedCtx.clearRect(0, 0, cropWidth, cropHeight); + croppedCtx.drawImage(image, minX, minY, cropWidth, cropHeight, 0, 0, cropWidth, cropHeight); const croppedURL = croppedCanvas.toDataURL(); const croppedImage = new Image(); croppedImage.src = croppedURL; |