EXIF Orientation metadata option does not affect when drawing image on canvas.

[cherevichka]

If the JPEG image has orientation metadata, the drawImage method draws an unrotated image.

Steps to Reproduce

1. Download JPG image with orientation metadata:

2. Load the image with loadImage utility.

3. Draw the image on canvas.

const image = await loadImage("image_path");
const canvas = createCanvas(image.width, image.height);
const context = canvas.getContext("2d");

context.drawImage(image, 0, 0);

const result = canvas.toBuffer();

fs.writeFileSync("result_path", result);

Expected:

Got:

Tested on MacOS, CentoOS.

Thanks!

[willemmulder]

@cherevichka Yes I'm having the same problem on Windows and Linux!

Did you find a workaround by any chance?

[willemmulder]

@cherevichka I'm now using the 'jpeg-autorotate' package to fix images before I use canvas.loadImage. It works, but it is not optimal :-)

[cherevichka]

@willemmulder I use the exif-parser package to determine the orientation of the image, and then rotate the image when needed.

It works, but it is not optimal :-)

[saberjsd]

@cherevichka Hello, would you tell me how to do in code to resolve this problem?

[LinusU]

Could anyone confirm that the browsers canvases does indeed rotate the image according to exif data when using drawImage?

[nrkn]

@LinusU yes, it works as expected in browser

[kartikdutt18]

Hey, the change looks good, we would also like to have this change part of the new canvas version