views:

28

answers:

1

Hi

I am using the YUI Image cropper to, well crop images. I have the cropper all set up ok. I am now setting the cropper's width's and height vars to defined values that fit my website structure.

I have the cropper set up so that a small resized version of the original is shown with the cropper attached to that. Now, my problem is determining what size to set the overlay to.

For example, my original image is say 1000x750, my resized image with the cropper attached to it is say 600x450. My final cropped image must be 205x655 - what is the correct formula to determine what size my crop overlay should be? In otherwords, how do I work out the correct ratio?

I also need a formula to convert the positioning values (top and left) return from the crop to run a crop from the original image (opposite of the previous ratio?)

Thanks

+1  A: 

So there are 4 rectangles/images:

  1. The original picture: 1000x750 (varies)
  2. The (temporarily) resized picture: 600x450 (varies within those limits, preserving aspect ratio?)
  3. The resized crop box: 123x393 (varies)
  4. The final cropped image: 205x655 (fixed requirement)

Is that correct?

If so, just compute the resize ratio and key everything off of that.

Pseudo Code:

ResizeRatio             = resizedPicture_width / originalPicture_width;
//-- Note that this assumes aspect ration was preserved, like it should be.

resizedCropBox_width    = 655 * ResizeRatio;
resizedCropBox_height   = 205 * ResizeRatio;

//-- Now translate from the resized crop position to the original pic postion.
finalCropTop            = resizedCropTop  / ResizeRatio;
finalCropLeft           = resizedCropLeft / ResizeRatio;
Brock Adams
Brilliant thanks
Ashley
@Ashley: You're welcome.
Brock Adams