vinothpandian/react-sketch-canvas

Export image changes the original background image

RitaBeloMoreira opened this issue · 2 comments

RitaBeloMoreira commented

Describe the bug
Hi,

When I export the image with background (exportWithBackgroundImage), the final image is cropped:

-- Original Image

Screenshot 2022-09-29 at 15 21 30

-- Final Image with preserveBackgroundImageAspectRatio="none"

Screenshot 2022-09-29 at 15 21 48

-- Final Image with preserveBackgroundImageAspectRatio="xMidYMid meet"

Screenshot 2022-09-29 at 15 21 35

Can you please help me?
Thanks!

Tested here: https://vinoth.info/react-sketch-canvas/

danielvdm2000 commented

I just ran into the same problem.

The problem arises because the background image is drawn on the canvas in the original size.

So, if the image is bigger than the canvas it will be cropped.

My solution was to resize the image to the same size as the canvas before passing it to the backgroundImage prop.

RitaBeloMoreira commented

I just ran into the same problem.

The problem arises because the background image is drawn on the canvas in the original size.

So, if the image is bigger than the canvas it will be cropped.

My solution was to resize the image to the same size as the canvas before passing it to the backgroundImage prop.

Thanks for your answer, that works!!