By sunjie


2011-07-07 06:00:49 8 Comments

I want to calculate the image width and size for resize. I think there can be three situations:

1. Image width exceeds the maximum width limit: Then resize the image width to the maximum width, and calculate the height according to the maximum width limit. For example, image width is 2248, and height is 532. The width exceeds but height is less. So reduce the width to maximum 1024 and calculate height, which will be around 242.

2. Image height exceeds the maximum height limit: Similarly, resize the height to maximum height and calculate the width accordingly.

3. Height and width both exceeds the maximum height and maximum width: Process further, find out if the image is vertical or horizontal. If the image is horizontal, resize width to maximum width and calculate height according to that. Else, if the image is vertical or square, resize height to maximum and calculate width according to that.

For these situations, Can you have a look my code below,give your expert opinion about it, if it is any good? Or can it be improved? How?

PS. I asked similar question yesterday. In my previous question I was not sure what the logic should be, and now I know what it should be (mentioned above), and would like to know if its any good. Thanks for any help.

<?
$max_width = 1024;
$max_height = 768;

$img = "t2.jpg";


list($original_width, $original_height) = getimagesize($img);

if (($original_width > $max_width) OR ($original_height > $max_height))
{
//original width exceeds, so reduce the original width to maximum limit.
//calculate the height according to the maximum width.
    if(($original_width > $max_width) AND ($original_height <= $max_height))
    {   
        $percent = $max_width/$original_width;  
        $new_width = $max_width;
        $new_height = round ($original_height * $percent);
    }

    //image height exceeds, recudece the height to maxmimum limit.
    //calculate the width according to the maximum height limit.
    if(($original_width <= $max_width) AND ($original_height > $max_height))
    {
        $percent = $max_height/$original_height;
        $new_height = $max_height;
        $new_width = round ($original_width * $percent);
    }

    //both height and width exceeds.
    //but image can be vertical or horizontal.
    if(($original_width > $max_width) AND ($original_height > $max_height))
    {
        //if image has more width than height
        //resize width to maximum width.
        if ($original_width > $original_height)
        {
            $percent = $max_width/$original_width;
            $new_width = $max_width;
            $new_height = round ($original_height * $percent );
        }

        //image is vertical or square. More height than width.
        //resize height to maximum height.  
        else
        {
        $new_height = $max_height;
        $percent = $max_height/$original_height;
        $new_height = $max_height;
        $new_width = round ($original_width * $percent);
        }
    }
} 
?>

6 comments

@Sandesh 2014-12-12 07:24:59

TO get width & height of Image Try this

$image_info = getimagesize($_FILES["file_field_name"]["tmp_name"]);
$image_width = $image_info[0];
$image_height = $image_info[1];

@Omar Soubhieh 2013-09-20 16:38:04

I find this to be a more elegant solution to scale up or down, if you only want to scale down just add if($scale_percent<1) {}

<?php
$width  = $max_width = 400;
$height = $max_height = 400;
$size = getimagesize($img);
if(count($size)) {
    $width = $size[0];
    $height = $size[1];
    $width_percent = $max_width/$width;
    $height_percent = $max_height/$height;
    $scale = ($width_percent>$height_percent)?'height':'width';
    $scale_percent = $scale.'_percent';
    $scale_percent = $$scale_percent;   
    $width*=$scale_percent;
    $height*=$scale_percent;        
}
?>

@htoip 2013-04-25 22:00:54

Using the same variable names and the if statement preventing upscaling:

<?php
$max_width = 1024;
$max_height = 768;

$img = "t2.jpg";


list($original_width, $original_height) = getimagesize($img);

$ratio = ($max_width / $original_width < $max_height / $original_height
  ? $max_width / $original_width
  : $max_height / $original_width
);
if ($original_width > $max_width || $original_height > $max_height) {
  $new_width = $original_width * $ratio;
  $new_height = $original_height * ratio;
} 
?>

@YonoRan 2011-07-07 06:38:49

There is a very handy class that I often use for just this type of work, resizing images while retaining aspect ratio. It lets you resize the image to a given height or width...

Image resizing class

Note: you have to register on that site to get the file

@khululekani 2011-10-24 14:58:04

// Usage example to find the proper dimensions to resize an image down to 300x400 pixels maximum: 
list($width, $height) = getimagesize($image); 
$new_dimensions = resize_dimensions(100,100,$width,$height);  


// Calculates restricted dimensions with a maximum of $goal_width by $goal_height 
function resize_dimensions($goal_width,$goal_height,$width,$height) { 
    $return = array('width' => $width, 'height' => $height); 

    // If the ratio > goal ratio and the width > goal width resize down to goal width 
    if ($width/$height > $goal_width/$goal_height && $width > $goal_width) { 
        $return['width'] = $goal_width; 
        $return['height'] = $goal_width/$width * $height; 
    } 
    // Otherwise, if the height > goal, resize down to goal height 
    else if ($height > $goal_height) { 
        $return['width'] = $goal_height/$height * $width; 
        $return['height'] = $goal_height; 
    } 

    return $return; 
}

@bjoernz 2011-07-07 07:36:32

I don't know PHP, but I would do it this way (in C++ pseudo code):

float ratio = 1.0;
float ratio_w = max_width/static_cast<float>(original_width);
float ratio_h = max_height/static_cast<float>(original_height);
float ratio_max = std::max(ratio_w, ratio_h);

if (ratio_max < 1.0)
{  
   // width & height are larger than allowed
   // scale to the larger scaling factor
   ratio = ratio_max;
}
else
{
   // pick a scaling factor <= 1.0
   ratio = std::min(ratio, ratio_w);
   ratio = std::min(ratio, ratio_h);
}

if (ratio < 1.0) // this if-clause is not necessary
{
   new_width = original_width * ratio;
   new_height = original_height * ratio;   
}

I edited my code to include the third case, which I ignored before. I generally try to avoid nested if-statements, because of readability (personal style) and partially performance reasons ( mostly superstition ;-) ).

I don't know if my version is faster or more readable than the original version, but at least the redundancy of the $new_width and $new_height assignments is gone.

@sunjie 2011-07-07 08:03:54

thanks. its nice, but try to check with width: 1600 and height:1200. Its 3rd case in my question, and it is a horizontal image. It will work fine if i want to convert to 1024x768. But lets try to convert with any irregular ratio, eg. width: 900px, height: 500. And this will give result: width: 667, height:500. while i want it to select with respect to the max width in this case. eg. set width 900, so height should be 675. did you understand?

@bjoernz 2011-07-07 10:54:32

Ah, sorry, I did not read your question carefully. I thought the image always has to fit into the box ;-)

@sunjie 2011-07-07 11:10:12

no problem. So what you think about my approach then? :)

@bjoernz 2011-07-07 11:59:04

I updated my answer, but if your code works, don't change it :-)

@sunjie 2011-07-07 12:03:41

thanks again. yeah my code works as it should, but i was just wondering if i'm doing the ugly way.

Related Questions

Sponsored Content

31 Answered Questions

[SOLVED] How do I auto-resize an image to fit a 'div' container?

35 Answered Questions

[SOLVED] How to vertically align an image inside a div

26 Answered Questions

[SOLVED] How to get image size (height & width) using JavaScript?

43 Answered Questions

24 Answered Questions

[SOLVED] Image Processing: Algorithm Improvement for 'Coca-Cola Can' Recognition

38 Answered Questions

[SOLVED] Lazy load of images in ListView

12 Answered Questions

[SOLVED] Calculating image size ratio for resizing

3 Answered Questions

[SOLVED] Resize image proportionally with MaxHeight and MaxWidth constraints

1 Answered Questions

image resize with window width, but keep ratio

  • 2014-12-03 08:44:45
  • yimmy
  • 109 View
  • 0 Score
  • 1 Answer
  • Tags:   css image resize

2 Answered Questions

[SOLVED] Enable automatic image resizing

  • 2012-01-26 11:31:12
  • Frank Natoli
  • 16556 View
  • 2 Score
  • 2 Answer
  • Tags:   html image

Sponsored Content