[Webinar] Streamline your web hosting managementRegister Today

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 534
  • Last Modified:

Correction of rotation of pictures coldfusion

Portrait pictures get rotated?

http://www.housecarers.com/photo_view2.cfm?mem=2145674015&slide=6

So this is an example of the same page where the image is ok - for another client.
It does not happen for most images posted by clients  - just some

http://www.housecarers.com/photo_view2.cfm?mem=2145661960&slide=4

Please how do I Prevent this? - display without rotation, or rotate back to normal
I just want the picture to display as is.


When I look at the original it is OK see below - it is portrait - see here:
http://housecarers.com/pics/2145674015_6.jpg?ref=%227842%22

I am told I will need a coldfusion server solution, the reason only some images appear flipped is becuase
the cameras are different. this is meta data set by the camera - nothing to do with CSS.

I am on CF10

I am also told while I can do rotation client side,
I would need to wait until the image is loaded to get the exif_data to determine whether
 to rotate or not. imo, lots of unnecessary work that's better left to the server

<IMG ID="DataField40" SRC="/pics/2145674015_6.jpg?ref=4096"  
ALT="House Sitters Pictures from YouthfulRetiree">

Open in new window

0
Ian White
Asked:
Ian White
1 Solution
 
_agx_Commented:
Edit: Added more detail


Please how do I Prevent this? - display without rotation, or rotate back to normal I just want the picture to display as is.

If I'm not mistaken, I think that IS the actual angle of the image, and the EXIF orientation tells capable devices how to rotate it.  If so, you'd need to apply any orientation shift to the image object.

To do it server side, the basic process would be:

1) read the orientation from the metadata.
2) use the returned orientation to rotate the image to the correct position
3) Fix (or remove) the orientation value in the metadata. (Otherwise, the browser will continue to rotate the image).
4) Save the "fixed" image to disk.

Unfortunately .. CF doesn't have much in the way of native EXIF functionality.  It only supports "reading" metadata. AFAIK there are no functions for modifying or saving metadata.

If you don't need to preserve the metadata, the simplest option is to manipulate the image and save the fixed image to disk. ImageWrite erases all metadata, so once you save a new copy of the image, the "orientation" value won't be an issue anymore. Note - since image functions are very process intensive, only do this once, when the image is uploaded/added.

For example, using the image above:

<cfset origImage = imageRead(ExpandPath("2145674015_6.jpg"))>
<!--- get orientation from metadata --->
<cfset orientation = ImageGetEXIFTag(origImage,"orientation")>
<cfif orientation eq "Right side, top (Rotate 90 CW)">
	<cfset ImageRotate(origImage, 90)>
</cfif>
<!--- save it to disk WITHOUT the metadata --->
<cfset imageWrite(origImage, ExpandPath("newImage.jpg"))>


Fixed Image: <img src="newImage.jpg">

Open in new window



Of course you need to handle other orientations as well.  Unfortunately, CF seems to present a "human friendly" description instead of the standard orientation values used by most programs: ie orientation 1-8. I don't see a listing of possible values in the CF docs anywhere, so you may need to do some research on those. But the basic idea is the same. Get the orientation, rotate or flip the image accordingly.

If you need to preserve the EXIF metadata for some reason, try something like http://writeexif.riaforge.org/. I have not used it myself, but it may work.
0
 
Ian WhiteOwner and FounderAuthor Commented:
Thanks - I think I will just give the users the option to rotate
0

Featured Post

Free Tool: SSL Checker

Scans your site and returns information about your SSL implementation and certificate. Helpful for debugging and validating your SSL configuration.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now