Php 如何旋转图像并保存图像

在我的应用程序中，div中有一个图像，一个按钮

我想在使用jquery单击按钮时旋转显示的图像并保存旋转后的图像

我已经使用了代码：

和jquery代码：

$(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代码：

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

当我使用上述代码时，有两个图像，一个是旧图像，另一个是旋转图像

在这里，我想旋转相同的图像，只显示旋转后的图像。并将旋转后的图像保存到目录中

如何使用jquery实现这一点？ 如果jquery无法实现，那么如何使用php/ajax实现呢

//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");

看看：

以及：

---

图像旋转：PNG或JPEG取决于服务器上保存的文件类型

// File and rotation
$rotateFilename = '/var/www/your_image.image_type'; // PATH
$degrees = 90;
$fileType = strtolower(substr('your_image.image_type', strrpos('your_image.image_type', '.') + 1));

if($fileType == 'png'){
   header('Content-type: image/png');
   $source = imagecreatefrompng($rotateFilename);
   $bgColor = imagecolorallocatealpha($source, 255, 255, 255, 127);
   // Rotate
   $rotate = imagerotate($source, $degrees, $bgColor);
   imagesavealpha($rotate, true);
   imagepng($rotate,$rotateFilename);

}

if($fileType == 'jpg' || $fileType == 'jpeg'){
   header('Content-type: image/jpeg');
   $source = imagecreatefromjpeg($rotateFilename);
   // Rotate
   $rotate = imagerotate($source, $degrees, 0);
   imagejpeg($rotate,$rotateFilename);
}

// Free the memory
imagedestroy($source);
imagedestroy($rotate);

它对我有用，试试看。

<?php //image rotate code here 
         if(isset($_POST['save']))
         {
             $degrees=90;

             $new_file=$sourceName;
             $filename ="http://localhost/dostoom/files_user/1000/4/153.jpg";
             $rotang = $degrees;
             list($width, $height, $type, $attr) = getimagesize($filename);
              $size = getimagesize($filename);
              switch($size['mime'])
              {
                 case 'image/jpeg':
                                     $source =
         imagecreatefromjpeg($filename);
                                     $bgColor=imageColorAllocateAlpha($source, 0, 0,
         0, 0);
                                     $rotation = imagerotate($source,
         $rotang,$bgColor);
                                     imagealphablending($rotation, false);
                                     imagesavealpha($rotation, true);
                                     imagecreate($width,$height);
                                     imagejpeg($rotation,$new_file);
                                     chmod($filename, 0777);
                 break;
                 case 'image/png':

                                     $source =
         imagecreatefrompng($filename);
                                     $bgColor=imageColorAllocateAlpha($source, 0, 0,
         0, 0);
                                     $rotation = imagerotate($source,
         $rotang,$bgColor);
                                     imagealphablending($rotation, false);
                                     imagesavealpha($rotation, true);
                                     imagecreate($width,$height);
                                     imagepng($rotation,$new_file);
                                     chmod($filename, 0777);
                 break;
                 case 'image/gif':

                                     $source =
         imagecreatefromgif($filename);
                                     $bgColor=imageColorAllocateAlpha($source, 0, 0,
         0, 0);
                                     $rotation = imagerotate($source,
         $rotang,$bgColor);
                                     imagealphablending($rotation, false);
                                     imagesavealpha($rotation, true);
                                     imagecreate($width,$height);
                                     imagegif($rotation,$new_file);
                                     chmod($filename, 0777);
                 break;
                 case 'image/vnd.wap.wbmp':
                                     $source =
         imagecreatefromwbmp($filename);
                                     $bgColor=imageColorAllocateAlpha($source, 0, 0,
         0, 0);
                                     $rotation = imagerotate($source,
         $rotang,$bgColor);
                                     imagealphablending($rotation, false);
                                     imagesavealpha($rotation, true);
                                     imagecreate($width,$height);
                                     imagewbmp($rotation,$new_file);
                                     chmod($filename, 0777);
                 break;
              }
         }

    ?>

您可以尝试我的解决方案来旋转图像

<?php

ob_start();

// Content type
header('Content-type: image/jpeg');

class RotateImage {
    private $_path;
    private $_degrees;

    public function __construct($path, $degrees){
        $this->_path = $path;
        $this->_degrees = $degrees;
    }

    public function rotate() {
        $image = new Imagick($this->_path);
        $image->rotateimage('black', $this->_degrees);
        echo $image->getImageBlob();
        exit();
    }


}



if($_SERVER['REQUEST_METHOD'] == 'GET'){
    $sourceImagePath = isset($_GET['image_path']) ? $_GET['image_path'] : null;
    $degrees = isset($_GET['degrees']) ? $_GET['degrees'] : 90;

    $obj = new RotateImage($sourceImagePath, $degrees);
    return $obj->rotate();
}
?>

---

旋转图像并以任何角度保存图像都有帮助。例如，我们将图像旋转180度。我们可以将该图像（180度）保存到我们的文件夹中。这里我们使用canvas。这对ASP.NET开发人员有帮助

&时代；
图片预览

protectedvoid ok finalsave_单击（对象发送方，事件参数e）
{
一串
CropImageLocation=ConfigurationManager.AppSettings[“CropFileLocation”].ToString（）；
CropImageLocation=CropImageLocation+DateTime.Now.ToString（“yyyyMMdd”）+“\\”+LoannNumber.Value；
一串
a=CropImageLocation+“\\”+贷款编号.值+“\u号”；
一串
base64String=hfData.Value.Replace（“数据：image/png；base64，”，string.Empty）；
字节[]
字节=Convert.FromBase64String（base64String）；
一串
filePath=a；
如果（！Directory.Exists（CropImageLocation））{
CreateDirectory（CropImageLocation）；
}
如果（文件.Exists（a））{
文件.Delete（CropImageLocation+“\\”+LoanNumber.Value+“\u符号”）；
}
System.IO.File.writealBytes（CropImageLocation+“\\”+LoanNumber.Value+“\u SIGN.jpeg”，字节）；
SaveCropedPath（LoanNumber.Value，CropImageLocation+“\\”+LoanNumber.Value+“\\”符号.jpeg”）；
}
var img=null，canvas=null；
$（函数（）{
$（“画布”）.css（“显示”、“无”）；
img=document.getElementById（'CropImg'）；
canvas=document.getElementById（'canvas'）；
如果（！canvas | |！canvas.getContext）{
canvas.parentNode.removeChild（canvas）；
}否则{
//img.style.position='绝对'；
//img.style.visibility='隐藏'；
}
旋转年龄（0）；
$（'#btnRotate'）。单击（函数（）{
$（“#CropImg”）.css（“显示”、“无”）；
$（“画布”）.css（“显示”、“块”）；
如果（img.className==“北”）{
旋转年龄（90）；
img.className=“西方”；
}else if（img.className==“west”）{
旋转年龄（180）；
img.className=“南方”；
}else if（img.className==“南”）{
轮换年龄（270）；
img.className=“东”；
}else if（img.className==“东”）{
旋转年龄（0）；
img.className=“北”；
}
});
});
函数旋转年龄（度）{
if（document.getElementById（'canvas'））{
var context=canvas.getContext（'2d'）；
var cw=惯性宽度，ch=惯性高度，cx=0，cy=0；
开关（度）{
案例90：
cw=img.高度；
ch=img.宽度；
cy=惯性高度*（-1）；
打破
案例180：
cx=img.宽度*（-1）；
cy=惯性高度*（-1）；
打破
案例270：
cw=img.高度；
ch=img.宽度；
cx=img.宽度*（-1）；
打破
}
canvas.setAttribute（'width'，cw）；
canvas.setAttribute（'height'，ch）；
旋转（度*Math.PI/180）；
背景图像（img、cx、cy）；
document.getElementById（'hfData'）。value=canvas.toDataURL（）；
}否则{
开关（度）{
案例0：
image.style.filter='progid:DXImageTransform.Microsoft.BasicImage（rotation=0）'；
打破
案例90：
image.style.filter='progid:DXImageTransform.Microsoft.BasicImage（rotation=1）'；
打破
案例180：
image.style.filter='progid:DXImageTransform.Microsoft.BasicImage（rotation=2）'；
打破
案例270：
image.style.filter='progid:DXImageTransform.Microsoft.BasicImage（rotation=3）'；
打破
}
}
}

基于nagarjun daram使用图像和画布的唯一Javascript解决方案

使用数据URL，完整工作示例：

注意，跨原点图像可能不起作用，至少在小提琴上是这样

主旋转代码：

function rotateDegrees(degrees, imgSrc, callback){
  var canvasElement = document.getElementById('canvas'); //or create
  if (!canvasElement || !canvasElement.getContext) {
    return showUnsupported();
  }
  //We use an additional img to get the sizes
  var img = document.getElementById('tmpImg'); //or create
  img.onload = function(){
      var cw = img.width,
        ch = img.height,
        cx = 0,
        cy = 0;
      switch (degrees) {
        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;
      }
      var context = canvas.getContext('2d');
      canvas.setAttribute('width', cw);
      canvas.setAttribute('height', ch);
      context.rotate(degrees * Math.PI / 180);
      context.drawImage(img, cx, cy);
      var result = canvas.toDataURL();
      callback && callback(result);
  }
  img.src = imgSrc;
}

---

注意回调等待图像加载到临时img中

您无法使用JavaScript保存数据。使用AJAX保存图像。参见本文我已经使用AJAX上传了图像。现在我想旋转它？试试这个：你实际上需要使用来编写文件，而不是

文件内容（）

。谢谢。但我不能使用文件内容（）保存旋转的图像。我用函数imagejpeg（）代替。用imagepng（）或imagejpeg（）代替文件内容（）。简单而甜蜜。你正在回复一篇超过7年的帖子。如果你的帖子是这个问题的一个很好的答案，并且你觉得这个答案比已经发布的其他答案要好，你能不能在帖子中加入一些文字来解释你的想法