How to Rotate Image and Save the Image

How to rotate image and save the image

//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()

I'm rotating image in java but want to save rotated image

Let's start with, this isn't rotating the image, it's rotating the Graphics context which is used to display the image, it doesn't affect the original image at all

@Override
protected void paintComponent(Graphics g) {
    super.paintComponent(g);

    Graphics2D g2d = (Graphics2D) g.create();

    g2d.setColor(Color.RED);
    g2d.drawLine(getWidth() / 2, 0, getWidth() / 2, getHeight());
    g2d.drawLine(0, getHeight() / 2, getWidth(), getHeight() / 2);

    g2d.setColor(Color.BLACK);
    int x = (getWidth() - image.getWidth()) / 2;
    int y = (getHeight() - image.getHeight()) / 2;
    AffineTransform at = new AffineTransform();
    at.setToRotation(getAngle(), x + (image.getWidth() / 2), y + (image.getHeight() / 2));
    at.translate(x, y);
    g2d.setTransform(at);
    g2d.drawImage(image, 0, 0, this);
    g2d.dispose();
}

And then this...

  try {
        File imagefile = new File("C:/pics/1206.jpg");
        image = ImageIO.read(imagefile);

        ImageIO.write(image, "jpg",new File("C:/pics"));
        ImageIO.write(image, "bmp",new File("C:/pics"));
        ImageIO.write(image, "gif",new File("C:/picsf"));
        ImageIO.write(image, "png",new File("C:/pics"));
  } catch (IOException ex) {
        ex.printStackTrace();
  }

which just saves the original image to a number of different formats ... to the same file , but doesn't even react to any changes to the angle

Instead, you need to use something which generates a new image from the original, rotated by the amount you want...

  public BufferedImage rotateImageByDegrees(BufferedImage img, double degrees) {
        double rads = Math.toRadians(degrees);
        double sin = Math.abs(Math.sin(rads)), cos = Math.abs(Math.cos(rads));
        int w = img.getWidth();
        int h = img.getHeight();
        int newWidth = (int) Math.floor(w * cos + h * sin);
        int newHeight = (int) Math.floor(h * cos + w * sin);

        BufferedImage rotated = new BufferedImage(newWidth, newHeight, BufferedImage.TYPE_INT_ARGB);
        Graphics2D g2d = rotated.createGraphics();
        AffineTransform at = new AffineTransform();
        at.translate((newWidth - w) / 2, (newHeight - h) / 2);

        int x = clickPoint == null ? w / 2 : clickPoint.x;
        int y = clickPoint == null ? h / 2 : clickPoint.y;

        at.rotate(rads, x, y);
        g2d.setTransform(at);
        g2d.drawImage(img, 0, 0, this);
        g2d.setColor(Color.RED);
        g2d.drawRect(0, 0, newWidth - 1, newHeight - 1);
        g2d.dispose();

        return rotated;
  }

Then you can save it...

File imagefile = new File("C:/pics/1206.jpg");
image = ImageIO.read(imagefile);

BufferedImage rotated = rotateImageByDegrees(image, 22.5);
ImageIO.write(rotated, "png", new File("RotatedBy225.png"));

So, the next time you use one of my previous examples and I tell you it's not doing what you think/want it to, I hope you will understand my meaning better and look more closly at the other examples we show you

Python 3.x PIL image saving and rotating

the Image.rotate() returns a rotated copy of this image.

so how about try:

  im = Image.open(image_file)
  im=im.rotate(270, expand=True)
  im.show()
  im.save('rotated.jpg')

see the docs:https://pillow.readthedocs.io/en/3.1.x/reference/Image.html#PIL.Image.Image.rotate

jquery rotate an image and save them with same name file (overwrite)?

Your question has 2 parts (as I understood)

save them and same name file.

To save them you just need to change the href attribute of the link #download to the dataURL of the image, like this:

$('#download').attr('href', canvas.toDataURL())

You also need to add the download attribute.

Which brings us to the second question with same name - you can specify the name of the file which will be downloaded by setting the download attribute's value as you want, like:

<a id="download" download="you_name_the_file.jpg">Download as image</a>

The full code (it will not work here because of security reason, you can see the live version here)

var img = null, canvas = null;

$(document).ready(function(){
  //  Initialize image and canvas
  img = document.getElementById('image');
  canvas = document.getElementById('canvas');

  if(!canvas || !canvas.getContext){
    canvas.parentNode.removeChild(canvas);
  } else {
    img.style.position = 'absolute';
    img.style.visibility = 'hidden';
  }
  rotateImage(0);

  //  Handle clicks for control links
  $('#resetImage').click(function(){ rotateImage(0); });
  $('#rotate90').click(function(){ rotateImage(90); });
  $('#rotate180').click(function(){ rotateImage(180); });
  $('#rotate270').click(function(){ rotateImage(270); });
});

function rotateImage(degree)
{
  if(document.getElementById('canvas')){
    var cContext = canvas.getContext('2d');
    var cw = img.width, ch = img.height, cx = 0, cy = 0;

    //   Calculate new canvas size and x/y coorditates for image
    switch(degree){
      case 90:
        cw = img.height;
        ch = img.width;
        cy = img.height * (-1);
        break;
      case 180:
        cx = img.width * (-1);
        cy = img.height * (-1);
        break;
      case 270:
        cw = img.height;
        ch = img.width;
        cx = img.width * (-1);
        break;
    }

    //  Rotate image            
    canvas.setAttribute('width', cw);
    canvas.setAttribute('height', ch);
    cContext.rotate(degree * Math.PI / 180);
    cContext.drawImage(img, cx, cy);
    $('#download').attr('href', canvas.toDataURL())
  } else {
    //  Use DXImageTransform.Microsoft.BasicImage filter for MSIE
    switch(degree){
      case 0: image.style.filter = 'progid:DXImageTransform.Microsoft.BasicImage(rotation=0)'; break;
      case 90: image.style.filter = 'progid:DXImageTransform.Microsoft.BasicImage(rotation=1)'; break;
      case 180: image.style.filter = 'progid:DXImageTransform.Microsoft.BasicImage(rotation=2)'; break;
      case 270: image.style.filter =    'progid:DXImageTransform.Microsoft.BasicImage(rotation=3)'; break;
    }
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <img src="your_image_url.jpg" alt="Sample Image" id="image" />
  <canvas id="canvas"></canvas>
</div>
<p>
  <strong>Rotate Image: </strong>
  <a href="javascript:;" id="resetImage">Reset Image</a>
  <a href="javascript:;" id="rotate90">90°</a>
  <a href="javascript:;" id="rotate180">180°</a>
  <a href="javascript:;" id="rotate270">270°</a>
</p>

<a id="download" download="mqdefault.jpg">Download as image</a>

function RotateImg($filename = '',$angle = 0,$savename = false)
    {
       $original   =   imagecreatefromjpeg($filename);
       $rotated    =   imagerotate($original, $angle, 0);
       if($savename == false) {
                header('Content-Type: image/jpeg');
                imagejpeg($rotated);
            }
        else {
           imagejpeg($rotated,$savename);
        }
        imagedestroy($rotated);
    }

$filename   =   'http://images.all-free-download.com/images/graphiclarge/beautiful_nature_landscape_02_hd_picture_166206.jpg';

$saveto     =   $_SERVER['DOCUMENT_ROOT']."/images/test.jpg";

RotateImg($filename,90,$saveto);