I have a web page that displays images that I don't know their size in advance. I was trying to use the GD functions to make the script resize and crop the images from me " Just before they are displayed.. I don't need caches" but I failed.
I need a script that I can call like this
<img src="display.php?src=blablabla&height=100&width=200" ?>
or even by calculating the width and height of css to preserve the proportions and make the image touch the box from inside like
<img src="blabla.jpg" style="height:<?php echo $height; ?>; width:<?php echo width; ?>" />
I don't need any sort of caching. How can I do that ?
WideImage rlz! :)
The resize's like that:
header('Content-type: image/jpeg');
echo WideImage::load('image.jpg')->resize(200, 100)->asString('jpg', 80);
// image.jpg resized at 200x100 with 80% of quality
You'll need to use the first style. Because this would be happening server-side, you can't check the CSS to get the desired size.
You just need to use the GD functions to open the appropriate file, use imagecopyresampled() to resize it, and then output to the buffer using imagejpeg. Don't forget to set the right headers:
header('Content-type: image/jpeg');
OR phpthumb http://phpthumb.sourceforge.net/
Demo is available at: http://phpthumb.sourceforge.net/demo/demo/phpThumb.demo.demo.php
You are looking for TimThumb (Demo | Source Code):
Simply copy the source code into a new
document called ‘timthumb.php’, place
it in a folder on your site (ex:
/scripts/) and call the image like
this:
<img src="/scripts/timthumb.php?src=/images/whatever.jpg&h=150&w=150&zc=1" alt="">
Related
I have a PHP function that does on-the-fly image resizing for thumbnail creation.
I am having trouble as it's just displaying raw image stream instead of the actual image.
My code is using a function called thumbnail:
$thumbnail = thumbnail($item['filename'], 209, 137);
imagejpeg($thumbnail);
I've tried putting in:
header("Content-type: image/jpeg");
However, this just expects the full page to be an image. I have absolutely no idea where to go from here, been working at it for a while. I'd rather not save the image to disk although it's looking like this might be necessary.
You either
Do it the normal way
This mean you point at one url, and serve the contents of one image:
<img src="myimage.php">
and myimage.php is a script that looks like:
header('Content-type: image/jpeg');
imagejpeg($thumbnail);
die;
This technique has the advantage of being.. the normal way of doing things.
OR
Output the image inline
Using data uris outputting the contents as a base64 encoded string
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUA
AAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO
9TXL0Y4OHwAAAABJRU5ErkJggg==" alt="Red dot">
This technique is most appropriate with small images.
It has the advantage of meaning all the images are in the main http request - at the (possibly sizable) disadvantage of making the page harder to edit/build and possibly negating the benefits of browser caching (unless the html page is itself cached).
Being normal is easier
Regarding this statement in the question:
However, this just expects the full page to be an image
That's right - if you do it the normal way you want to point at your php script with the src attribute of an image tag, and server only an image - i.e. the exact same response as if you were pointing at an image file with a browser.
Unless you have a good reason to do things a different way - the "normal" way is a good place to start.
You can point an html img tag to an php file.
<img src='thumbnail.php?file=<?php echo $item['filename']; ?>' />
Then on your php file you display the image and change the headers since all it is doing is displaying an image.
$thumbnail = thumbnail($_GET['filename'], 209, 137);
imagejpeg($thumbnail);
header("Content-type: image/jpeg");
You need to insert the image like you would a normal image in HTML and create the image in a separate PHP file:
image.php
<?php
$img = imagecreate(100,100); //Create an image 100px x 100px
imagecolorallocate($img, 255,0,0); //Fill the image red
header('Content-type: image/jpeg'); //Set the content type to image/jpg
imagejpeg($img); //Output the iamge
imagedestroy($img); //Destroy the image
?>
myWebpage.html
<img src="image.php" />
I have a PHP function that does on-the-fly image resizing for thumbnail creation.
I am having trouble as it's just displaying raw image stream instead of the actual image.
My code is using a function called thumbnail:
$thumbnail = thumbnail($item['filename'], 209, 137);
imagejpeg($thumbnail);
I've tried putting in:
header("Content-type: image/jpeg");
However, this just expects the full page to be an image. I have absolutely no idea where to go from here, been working at it for a while. I'd rather not save the image to disk although it's looking like this might be necessary.
You either
Do it the normal way
This mean you point at one url, and serve the contents of one image:
<img src="myimage.php">
and myimage.php is a script that looks like:
header('Content-type: image/jpeg');
imagejpeg($thumbnail);
die;
This technique has the advantage of being.. the normal way of doing things.
OR
Output the image inline
Using data uris outputting the contents as a base64 encoded string
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUA
AAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO
9TXL0Y4OHwAAAABJRU5ErkJggg==" alt="Red dot">
This technique is most appropriate with small images.
It has the advantage of meaning all the images are in the main http request - at the (possibly sizable) disadvantage of making the page harder to edit/build and possibly negating the benefits of browser caching (unless the html page is itself cached).
Being normal is easier
Regarding this statement in the question:
However, this just expects the full page to be an image
That's right - if you do it the normal way you want to point at your php script with the src attribute of an image tag, and server only an image - i.e. the exact same response as if you were pointing at an image file with a browser.
Unless you have a good reason to do things a different way - the "normal" way is a good place to start.
You can point an html img tag to an php file.
<img src='thumbnail.php?file=<?php echo $item['filename']; ?>' />
Then on your php file you display the image and change the headers since all it is doing is displaying an image.
$thumbnail = thumbnail($_GET['filename'], 209, 137);
imagejpeg($thumbnail);
header("Content-type: image/jpeg");
You need to insert the image like you would a normal image in HTML and create the image in a separate PHP file:
image.php
<?php
$img = imagecreate(100,100); //Create an image 100px x 100px
imagecolorallocate($img, 255,0,0); //Fill the image red
header('Content-type: image/jpeg'); //Set the content type to image/jpg
imagejpeg($img); //Output the iamge
imagedestroy($img); //Destroy the image
?>
myWebpage.html
<img src="image.php" />
I have many animated .gifs on a page. I need a script or code that can freeze the animation of these .gifs so they do not animate and freeze on the first frame.
Currently the backgrounds are table cell backgrounds like this:
<td background="animated_background_1.gif">
and
<td style="background-image:url('animated_background_2.gif');">
The HTML used to display image (or as a background image or whatever):
<img src="giftopng.php?image=mypic.gif" alt="" />
The test script called: "giftopng.php"
<?php
//Get image name from URL
$image=$_GET['image'];
//Load the image
$img = ImageCreateFromGif($image);
//Convert to PNG and send it to browser
if($img) {
header("Content-Type: image/png");
ImagePNG($img);
//Clean-up memory
ImageDestroy($img);
}
?>
You could use something like this (source http://php.net/manual/en/function.imagecreatefromgif.php).
If the load is too high then you could cache the static image.
Have a look at http://slbkbs.org/jsgif code, it could help you with this issue.
jsgif is an animated GIF player bookmarklet with support for pausing, going frame-by-frame, playing in reverse, and other features that one might expect from a video player.
is there a way i can convert text into Image & then Rotate it & then display it all using script\code to display in the webpage
Yes, you can, take a look at GD's imagettfext or Imagick's annotateImage.
You can write a script, which you embed in your html-page like an usual image:
<img src="rotatedtext.php?text=blablubb" />
Don't forget to set the content-type of the http-header in that script to image/png (I recommend png for that purpose) before outputing the png-data:
//create the image here and then:
header("Content-Type: image/png");
imagepng($image);
I have a gif file with many icons and buttons on it..
What I want to do is include that gif file using php gd somefunction("file.gif")
then, resize the new image to 30px by 30px.. and then be able to position (using x and y coordinates) the actual gif file, so that only a certain area of the image shows on the new file..
just like the css background-position property but, with gd.
Thanx
imagecopyresized() resizes the image, so it doesn't quite work for what I was exactly looking for.
For anyone else that might need this, the best function is actually imagecopy().
http://www.php.net/manual/en/function.imagecopy.php
It will do the trick..
Thanx Trufa for the quick answer though.
imagecopyresized()
http://www.php.net/manual/en/function.imagecopyresized.php
Should do the trick for adjusting the size.