How to rotate image and save the image

galtech.Mariya picture galtech.Mariya · Jun 29, 2012 · Viewed 67.9k times · Source

In my application i have an image in a div,a button.

I want to rotate the image displayed and save the rotated image when i clicked on the button using jquery.

I already used the code:

http://code.google.com/p/jquery-rotate/

and jquery code:

$(function() {                                    // doc ready
                var rotation = 0;                             // variable to do rotation with
                $("#img").click(function() {
                    rotation = (rotation + 45) % 360; // the mod 360 probably isn't needed
                    $("#cropbox").rotate(rotation);
                });
            });

html code:

<img src="demo_files/pool.jpg" id="cropbox" />
<input type="button" id="img" name="img" value="click" />

When i using above code ,There have two images one is the old image and another is the rotated image.

Here i want to rotate the same image and displaying only the rotated image .And save the rotated image ina directory.

How can i do this using jquery? If it is not possible with jquery then how can i do it possible with php/ajax?

Answer

user849137 picture user849137 · Jun 29, 2012
//define image path
$filename="image.jpg";

// Load the image
$source = imagecreatefromjpeg($filename);

// Rotate
$rotate = imagerotate($source, $degrees, 0);

//and save it on your server...
imagejpeg($rotate, "myNEWimage.jpg");

Take a look at:

imagerotate()

And:

file_put_contents()