Cropping using a different aspect ratio

[mPeror]

Hi there,

I have two image sizes in my site: a small square thumbnail (50x50 px), and a bigger, wider "preview" size one (240x145 px)

I need all kinds of images to perfectly match the aspect ratio of the thumbnail/preview image sizes I'm using.

For square thumbnails, I coded something that could crop a square from the center of any image, so I can re size it later with no issues:

$source_image = array('height' => 0,
					  'width' => 0,
					  'path' => './images/picture.jpg'
					  );
 
list($source_image['width'], $source_image['height']) = getimagesize($source_image['path']);
 
 
$crop = array('x_axis' => 0,
			  'y_axis' => 0,
			  'width' => $source_image['width'],
			  'height' => $source_image['height']
			  );
 
 
// resize to 1:1 aspect ratio
 
if( $source_image['width'] > $source_image['height'] )
{
	$crop['x_axis'] = floor( ( $source_image['width'] - $source_image['height'] ) / 2 ); 
	$crop['width'] = $source_image['height'];
}
else if( $source_image['height'] > $source_image['width'] )
{
	$crop['y_axis'] = floor( ( $source_image['height'] - $source_image['width'] ) / 2 );
	$crop['height'] = $source_image['width'];
}
/*
... cropping code goes here ...
*/

But how do I do the same for the wider aspect ratio? Not only I don't how how to crop based on my 240x145 px image's aspect ratio, but I don't even know how to calculate its aspect ratio in the first place.

Any ideas?

Your help is much appreciated

[decowski]

    define('MAX_X', 240);
    define('MAX_Y', 145);

    if ($original_x > MAX_X || $original_y > MAX_Y) {
        if (MAX_X / $original_x < MAX_Y / $original_y) {
            $factor = MAX_X / $original_x;
        } else {
            $factor = MAX_Y / $original_y;
        }
    } else {
        $factor = 1;
    }

    $new_x = floor($original_x * $factor);
    $new_y = floor($original_y * $factor); 

[mPeror]

I'm afraid I don't understand the logic you've used here.

Are $new_x and $new_y the place where you should start cropping from? if so:
1) They don't seem incorrect. The coordinates don't seem to crop the center of the image.
2) how do I find out the width/height of the part I'm supposed to crop?

[decowski]

I'm afraid I don't understand the logic you've used here.

Are $new_x and $new_y the place where you should start cropping from? if so:
1) They don't seem incorrect. The coordinates don't seem to crop the center of the image.
2) how do I find out the width/height of the part I'm supposed to crop?

No. They are the width and height of your crop area (thumbnail size), with correct aspect ratio, not exceding the MAX_X and MAX_Y.

To calculate the coordinates:

$offset_x = round(($original_x - $new_x) / 2);
$offset_y = round(($original_y - $new_y) / 2); 

[mPeror]

but I'm trying to crop the center area that matches the ratio of the preview version, not the number of pixels, (just like I did with the square thumbnail) and then resize it to 240x145 pixels.

I hope this clarifies my question.

[decowski]

but I'm trying to crop the center area that matches the ratio of the preview version, not the number of pixels, (just like I did with the square thumbnail) and then resize it to 240x145 pixels.

I hope this clarifies my question.

Oh, I misunderstood you.

    define('MAX_X', 240);
    define('MAX_Y', 145);
    
    $thumbnail_aspect_ratio = MAX_X / MAX_Y;

    if ($original_x > MAX_X || $original_y > MAX_Y) {
        if (MAX_X / $original_x < MAX_Y / $original_y) {
            $new_x = round($original_y * $thumbnail_aspect_ratio);
            $new_y = $original_y;
        } else {
            $new_x = $original_x;
            $new_y = round($original_x / $thumbnail_aspect_ratio);
        }
    } else {
        $new_x = $original_x;
        $new_y = $original_y;    
    }

    $offset_x = round(($original_x - $new_x) / 2);
    $offset_y = round(($original_y - $new_y) / 2); 

[mPeror]

decowski, I appreciate your efforts, but your code doesn't seem to be working for me.

I'm wondering why are you still using the dimensions I've provided in your code's logic when I'm just looking to use the aspect ratio?

[decowski]

decowski, I appreciate your efforts, but your code doesn't seem to be working for me.

Have you actually tried and used the code? I've done some tests and it works here.

I'm wondering why are you still using the dimensions I've provided in your code's logic when I'm just looking to use the aspect ratio?

I'm using them to calculate the aspect ratio and to see if we need to adjust the height or the width of the cropping area to keep the aspect ratio.

Basically, if you want to match the aspect ratio of the thumbnail to the one of original image, without distorting it, you either need to pillarbox it (remove parts on the left and right hand side) or letterbox it (remove the parts on the top and bottom). What my script does is calculate the width, height and offsets required to do so.

[mPeror]

Yes, I'm afraid I've tried your script.

The coordinates I'm getting seem a bit off. But I can't really test it if I don't have how many pixels I'm supposed to crop. Your script shows me where to start cropping, but not how much to crop. (correct me if I'm wrong)

[decowski]

It does. $new_x and $new_y are the width and height of cropping area.