I think that this explains an issue and proposes a solution. Hopefully I can get some comments on it to confirm or correct it.
Image Rotation
When some cameras take an image in portrait orientation, they save a landscape image with a flag in the exif data specifying the correct (portrait) orientation.
Issue
Unless an image is being served directly from the media library, Umbraco uses ImageProcessor to edit the image and save a cached version of the resulting file. By default, the config file for ImageProcessor is set to: preserveExifMetaData="false". This means that the orientation flag is removed – which can result in images that appear “sideways”.
Solution 1:
If the config file is changed to preserveExifMetaData="true", the orientation flag is preserved – and the image displays correctly.
Exception:
We encountered a situation where we use ImageProcessor to preserve an image’s original dimensions (e.g. 3:4) add blank space to it to make a file with new dimensions (e.g. 16:9).
In this instance, ImageProcessor adds the whitespace correctly to the image (e.g. on the left and right). BUT… Unfortunately, it also preserves the orientation flag. Therefore, the correct image is subsequently rotated to what the browser assumes is its correct orientation, which is now not correct.
Solution 2:
Leave the config file in its initial preserveExifMetaData="false" state, and add “autorotate=true” to a querystring in the image URL.
I have a customer (version 8.16) who just had the same issue on a few images. Not sure why these images are upside down, but they are.
Checked my config and the AutoRotate plugin was already set up: preserveExifMetaData="false" and
Still, when I added "?autorotate=true" to the faulty image through markup, it was displayed correctly again. So I guess the autorotate plugin is not working on all images on this setup.
Markus, I'm afraid I didn't install the plugin, as I already had the autorotate code in place and the site went live sooner than expected. Since that time I've been getting our basic package adapted to v9, and have yet to seriously tackle the images.
I'll let you know when I do. (Thankfully, I have the wonky ones from the production site, so I can test them when I come to it.)
Unwanted rotating images
I think that this explains an issue and proposes a solution. Hopefully I can get some comments on it to confirm or correct it.
Image Rotation
When some cameras take an image in portrait orientation, they save a landscape image with a flag in the exif data specifying the correct (portrait) orientation.
Issue
Unless an image is being served directly from the media library, Umbraco uses ImageProcessor to edit the image and save a cached version of the resulting file. By default, the config file for ImageProcessor is set to:
preserveExifMetaData="false"
. This means that the orientation flag is removed – which can result in images that appear “sideways”.Solution 1:
If the config file is changed to
preserveExifMetaData="true"
, the orientation flag is preserved – and the image displays correctly.Exception:
We encountered a situation where we use ImageProcessor to preserve an image’s original dimensions (e.g. 3:4) add blank space to it to make a file with new dimensions (e.g. 16:9).
In this instance, ImageProcessor adds the whitespace correctly to the image (e.g. on the left and right). BUT… Unfortunately, it also preserves the orientation flag. Therefore, the correct image is subsequently rotated to what the browser assumes is its correct orientation, which is now not correct.
Solution 2:
Leave the config file in its initial
preserveExifMetaData="false"
state, and add“autorotate=true”
to a querystring in the image URL.eg:
src="@model.image.GetUrl()?autorotate=true"
Hi Ault
If you go down the route of adding? autorotate=true on all your images then check out this package:
https://our.umbraco.com/packages/website-utilities/auto-auto-rotate/
Which uses an event that ImageProcessor raises before it processes the image and appends the autorotate query string parameter to the url...
... So basically only one place to add it...
Regards
Marc
That looks perfect. Will install straightaway.
Ault, did this solve your case?
I have a customer (version 8.16) who just had the same issue on a few images. Not sure why these images are upside down, but they are.
Checked my config and the AutoRotate plugin was already set up: preserveExifMetaData="false" and
Still, when I added "?autorotate=true" to the faulty image through markup, it was displayed correctly again. So I guess the autorotate plugin is not working on all images on this setup.
Did the plugin work out of the box for you?
Markus, I'm afraid I didn't install the plugin, as I already had the autorotate code in place and the site went live sooner than expected. Since that time I've been getting our basic package adapted to v9, and have yet to seriously tackle the images.
I'll let you know when I do. (Thankfully, I have the wonky ones from the production site, so I can test them when I come to it.)
Ok, thanks for your reply! I'll try to see what is happening (or not) with our routing.
is working on a reply...