Resizing images comes up with a yellow issue

[TeddyKiller]

I have got this resizing image script from another thread. It was useful and did the job I needed.

However.. here are two links.

This one is without the resize

http://horble.com/test/test.php

This one is with the resize

http://horble.com/test/test1.php

 

The smaller the resize max size, the less yellow it is. Obviously.. the bigger and smaller you go will have an impact with distortion which I'd like to prevent if possible.

 

I'd like it to include cropping, if lets say the imagei s well out of proportion. eg: 100 x 720 so that it is a rectangle to crop it to a squarer shape, though I can't do that.

 

Here is the image resize script.

<?php 
$pic = $_GET['file'];

if (!isset($max_width))
      $max_width = 144;
   if (!isset($max_height))
      $max_height = 164;
  	
$size = GetImageSize($pic);
$width = $size[0];
$height = $size[1];

$x_ratio = $max_width / $width;
$y_ratio = $max_height / $height;

if ( ($width <= $max_width) && ($height <= $max_height) ) {
	$tn_width = $width;
	$tn_height = $height;
}

else if (($x_ratio * $height) < $max_height) {
	$tn_height = ceil($x_ratio * $height);
	$tn_width = $max_width;
}
else {
	$tn_width = ceil($y_ratio * $width);
	$tn_height = $max_height;
}

$src = imagecreatefromjpeg($pic);
$dst = imagecreate($tn_width, $tn_height);
imagecopyresized($dst, $src, 0,0,0,0, $tn_width, $tn_height, $width,$height);

header('Content-type: image/jpeg');
imagejpeg($dst);
imagedestroy($src);
imagedestroy($dst);
?>

[TeddyKiller]

Also looks very pixelated too. Basically, it looks very cheap.

[XeNoMoRpH1030]

Try using imagecopyresampled() instead of imagecopyresized().

 

Also, with imagejpeg(), you can specify the quality. The default is 75. Just do

imagejpeg($dst,NULL,100);

for the best quality, or whatever you prefer.

[TeddyKiller]

That didn't work

Any other ideas?

[XeNoMoRpH1030]

Oops, also forgot. Try using imagecreatetruecolor() instead of imagecreate()

[TeddyKiller]

Perfect. Thanks!

What about maybe the cropping?

[XeNoMoRpH1030]

It will probably take several formulas to get working right, depending on the exact dimensions you want. Lets use your example. The picture is 199x190 pixels. When you resize it, it's 90x86. What would the ideal size be? 90x90?

[TeddyKiller]

Yes. 90 x 90 would be best.

Though if an image is way out of proportion. eg: 100 x 720

You'd have to crop it at a big size, then resize it. Otherwise just cropping it to 90x90, could mean the person in the pic (if a person) may be cropped off unless it's center. Which in some cases isn't. With the example of 100 x 720, that's quite a rectangle, in this case images like that won't be allowed, but for the example it'd be 100 x 100. Then it can be resized to 90 x 90.

If you know what I mean.

 

If you had an image that only needed resizing, (meaning it's square already) it'll be a picture of a face, which is small for the dimensions for max width and height. If theres an image that needed cropping without resizing, it'll bring up a big zoomed in image. Which totally will go out of place with what I'm using it for.

 

Basically, if the image isn't already square, crop it to a square of any size, and resize it to be exactly 90 x 90.

[XeNoMoRpH1030]

Hrm, it sounds like you have a defined what is out of proportion and what isn't. When you crop, part of the image get's cut off. That's just how it is.

 

If you want to retain all of the image, then proportional resizing is the only way. You'd just end up with white space.

[TeddyKiller]

Surely if an image isn't A x A (A = a number) to crop it so that it is square, and then resize?

I suppose the best bet is to have a tool.. where a user can select there thumbnail where it will be square...

Do you know anything like that? I think its like.. tagged, or facebook. Not sure what one, but you have a square box to select your thumbnail of the image.

[litebearer]

Might look at these...

 

http://www.hotscripts.com/blog/javascript-image-cropping-scripts/

 

 

[TeddyKiller]

These are more of an interface. I'm looking for.. a rectangle image cropped to a perfect square. (If it's rectangle) Then resized down. If not rectangle, and is perfect square.. to resize it anyway.

 

I'll be using interfaces for profiles, like the one I state below. Though for the code I mentioned above for my resizing script, needs something to be done automatically like rectangle to square.

Got anything?

 

For the profiles, http://deepliquid.com/projects/Jcrop/demos.php found from the link you gave me, is a good one. Although it'd be good to be square, and square only. You can resize it, but it has to be square at all times.. if it's possible to do that?

[XeNoMoRpH1030]

http://www.chipwreck.de/blog/software/cwcrop/cwcrop-demo/

 

That's what I use.

 

If you want it to automatically crop it, that won't be a problem. Just need to decide if you want it to be "smart" or just start from the top/bottom left/right. I mention "smart" because I'm sure you could figure out how to do it in the middle, if that seems logical.

[TeddyKiller]

So what your saying, that can do it automatically. eg:

A rectangular image comes into the code, and displays as a square, without the use of the interface?

[XeNoMoRpH1030]

If that's what you want, of course. I'm just saying part of the image is getting cut off and there is no way to determine if that's the correct part that should be cropped or not.

[TeddyKiller]

It wouldn't matter so much. For a users display picture, when it gets picked it'll have an interface to allow them to pick a squared section. Which I might put as needed, rather than optional.

Though in some cases, they may not crop it via that way, in that case having it automatically cropped would be nessecary, and I couldn't give a hells damn if they didn't like it, because its there fault for not cropping it upon upload

That sounds mean.

 

Anyway, what I'm needing is for example, the demo you gave me, to make it a square box, and center it then crop it. Used for the code in this thread all up there ^^ it needs to be somewhat included so rectangle images get cropped to a square.

Then to resize that square to the size stated in the resize.

 

What would I need to do?

[litebearer]

Perhaps this may be useful...

 

<?php
// Original image
$filename = 'tower.jpg';
// cropped image name
$filename2 = 'c_' . $filename;
// Get dimensions of the original image
list($current_width, $current_height) = getimagesize($filename);

// The x and y coordinates on the original image where we
// will begin cropping the image
$left = 50;
$top = 50;

// This will be the final size of the image (e.g. how many pixels
// left and down we will be going)
$crop_width = 200;
$crop_height = 200;

// Resample the image
$canvas = imagecreatetruecolor($crop_width, $crop_height);
$current_image = imagecreatefromjpeg($filename);
imagecopy($canvas, $current_image, 0, 0, $left, $top, $current_width, $current_height);
imagejpeg($canvas, $filename2, 100);
?> 

[TeddyKiller]

Perhaps this may be useful...

 

<?php
// Original image
$filename = 'tower.jpg';
// cropped image name
$filename2 = 'c_' . $filename;
// Get dimensions of the original image
list($current_width, $current_height) = getimagesize($filename);

// The x and y coordinates on the original image where we
// will begin cropping the image
$left = 50;
$top = 50;

// This will be the final size of the image (e.g. how many pixels
// left and down we will be going)
$crop_width = 200;
$crop_height = 200;

// Resample the image
$canvas = imagecreatetruecolor($crop_width, $crop_height);
$current_image = imagecreatefromjpeg($filename);
imagecopy($canvas, $current_image, 0, 0, $left, $top, $current_width, $current_height);
imagejpeg($canvas, $filename2, 100);
?> 

 

Looks good, though I suppose it'd do the right job, for some images.

Though if it was 100 x 200, it wouldn't crop yet it still wouldn't be square.

What the change would be to crop it to the nearest square.

If the height is 100, the width would be 100. If the height is 300, the width should be 300.

Basically cropping the width, or the height so that it's both the same. Is that possible?

[litebearer]

Not really sure what you are asking.

 

The script allows you change the dimensions of the end result cropped image. You could add code that determines if the original has either dimension less than the desired cropped size and make code adjustments to handle that event.

 

Any orginal with either dimension less that the deisred cropped size would ultimately result in a cropped image with a portion being blank.

 

ie

 

 

if your wanted your cropped images to be 100 x 100

 

  set crop width to 100 and crop height to 100

 

Seeing as you are not concerned with what portion of the orginal is included in the cropped image,

 

set left to 0 and top to 0. (this is the upper left corner of the original)

 

  possibilites:

 

    original has a width and/or height less than the desired crop size

you would need to create a temp image with the greater of the two heights and the greater of the two widths. then 'overlay' the original onto the temp. Fianlly cropping the temp. This will result in some portion of the cropped image being blank

 

original is same size as desired cropped image

nothing to do

 

original has width and height both greater than desired cropped size

run the script

 

make sense?

 

[litebearer]

Also keep in mind - cropping and resizing are two differnt things.

[TeddyKiller]

Yeah. I do understand. Not sure if you understand me fully though.

Lets take it all bit by bit.

Taking an image at random, at the moment crops to 200 by 200.

It doesn't crop centrally, how can I do that?

[litebearer]

the top and left variables determine where on the original the upper left corner of the cropped portion will begin.

 

to center, subract the desired crop height from the original height the divide by 2 - that will give you the value of TOP. Do the same operation on the widths - that will give you the value of LEFT.

 

[TeddyKiller]

So if I'm right in saying..

$left = ($current_width - $crop_width) / 2;
$top = ($current_height - $crop_height) / 2;

 

Would work? (In your code I moved left and top to below the width and height)

[TeddyKiller]

I tried it and I removed the brackets and tried it. Neither worked. Though this did.

$sum1 = $current_width - $crop_width;
$left = $sum1 / 2;

$sum2 = $current_height - $height;
$top = $sum2 / 2;

 

Thanks.

 

As for the question I wanted to ask. So far it crops square central of the image, how do I set it so it crops a square in the center without a desired width and height. So it does it depending on the size of the image?

[TeddyKiller]

Bump..

Does anyone know?