Jun 5 2008

Crop Image Like Orkut

This entry is part 4 of 5 in the series Online Photoshop

Online Photoshop in PHP (Series Part 4) >>

Crop Image Like Orkut

Today we will discuss about cropping of images using php and gd library.

Look at the simple example here:

http://www.sajithmr.com/photoshop-tuts/crop/simplecrop.php

 
$x1 = $_GET['x1'];
$y1 = $_GET['y1'];
 
$x2 = $_GET['x2'];
$y2 = $_GET['y2'];	
 
$image_object =   imagecreatefromjpeg('hari.jpg');
$image_cropped =  Crop($image_object,$x1, $y1, $x2,$y2);
$temp_path = rand(1,99999)."hari.jpg";
imagejpeg( $image_cropped,$temp_path);
 
header('Location: simplecrop.php?img='.$temp_path );	  
 
?>

Here the Crop function is doing the real work. x1 and y1 are Top-Left Coordinates of new image and x2, y2 are the Bottom-Right .

Here is the function for Crop

function Crop($image, $xpos1,$ypos1,$xpos2,$ypos2)
	{
		require_once('class.cropcanvas.php');
		$cc =& new CropCanvas();
		$cc->loadImageFromObject($image);
		$cc->cropToDimensions($xpos1, $ypos1, $xpos2,$ypos2 );
		return $cc->getImageObject();
 
	}
 
?>

You can see the class.cropcanvas.php file from the attachment.

In the above example, we have to enter each coordinates manually. See the example below:

http://www.sajithmr.com/photoshop-tuts/crop/realcrop.php

Here you can select the area by click and drag (like orkut)

This is implemented with the help or jslib javascript. The given attachment in the end of this post contains the all.

http://www.sajithmr.com/photoshop-tuts/crop.zip

Keep reading for the further posts in this series. Next post is on Intellegent watermarking on images.

Subscribe to my Feeds: http://www.sajithmr.com/feed/

Series Navigation«Online Photoshop in PHP (Series Part 3)Intelligent Watermark (php + gd)»

TAGS: , , , ,

10 Comments on this post

Trackbacks

  1. jithesh said:

    Thanks…nice one

    August 5th, 2008 at 12:08 pm
  2. Noah said:

    Someone should make a “facebook / flickr” style image tagging script based on this where you can tag people or interesting things in a photo. I’m sure the right person could do it!

    October 7th, 2008 at 6:09 am
  3. developer said:

    Hey thank you so much
    as it too important for me when this functionality i was impleting in my site and not found proper soluntion.

    this code is realy usefull for me

    Thank you :)

    November 24th, 2008 at 8:25 pm
  4. jasan said:

    Hi,

    Really Very Nice Tutorial. This is exactly what i want.

    Thank you so much.

    December 12th, 2008 at 5:03 pm
  5. pradeep pathak said:

    Thanks for the code. Works Nice. Actually I was looking for a Orkut like photo upload script. If you have any like that, I would be highly thankful.

    January 14th, 2009 at 5:40 pm
  6. Chris said:

    Very impressive!

    I have a newbie question though. How would I lock the aspect ratio for the realcrop example (like 6×4 or 3×5)?

    Thanks.

    January 14th, 2009 at 10:16 pm
  7. harry said:

    if i want to crop image in square mode then what function i have to change please reply fast

    thanks

    January 28th, 2009 at 12:21 pm
  8. Cléber said:

    Harry, use this:
    Event.observe(
    window,
    ‘load’,
    function() {
    new Cropper.Img(
    ‘cropimage’,
    {
    onEndCrop: onEndCrop,
    ratioDim:{x:7.6923,y:10},
    }
    )
    }
    );
    Set the proportions to 1/1 in the “ratioDim” line.

    February 10th, 2009 at 5:57 pm
  9. manoj said:

    Hey m geting problem to corp photo on my orkut site

    March 25th, 2009 at 12:35 pm
  10. Eduardo said:

    You know where I can find a plugin for wordpress with the function of crop image? Thank you.

    April 25th, 2009 at 10:45 pm

LEAVE A COMMENT

Subscribe Form

Subscribe to Blog

Recent Comments

  • Sajith M.R: Press shift and enter key for a new line in chat
  • Borellus: Nice little function there, I think I may try to use it at some point.
  • Abhishek: Can we have newline characters…. i want something like this Line 1 Line 2 Line 3
  • Joanne Cox: Thanks for sharing this; your input is appreciated and has made me change my opinion slightly. About the...
  • Saboor: hi i also want to implement a chatting like Gmail or FaceBook , please, email me the source code on...

Recent Posts