2012-06-29 15 views
13

मेरे आवेदन में मेरे पास एक div, एक बटन में एक छवि है।छवि को घुमाने और छवि को बचाने के लिए

मैं छवि को घुमाने और घुमावदार छवि को सहेजना चाहता हूं जब मैंने jquery का उपयोग करके बटन पर क्लिक किया।

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

और 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); 
       }); 
      }); 

एचटीएमएल कोड:

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

जब मैं कोड ऊपर का उपयोग कर, वहाँ है दो छवियों

मैं पहले से ही कोड का इस्तेमाल किया एक पुरानी छवि है और दूसरा घुमावदार छवि है।

यहां मैं एक ही छवि को घुमाने और केवल घुमावदार छवि को प्रदर्शित करना चाहता हूं और घुमावदार छवि इना निर्देशिका को सहेजें।

मैं jquery का उपयोग करके यह कैसे कर सकता हूं? यदि jquery के साथ यह संभव नहीं है तो मैं php/AJAX के साथ यह कैसे संभव कर सकता हूं?

+4

आप जावास्क्रिप्ट का उपयोग कर डेटा सहेज नहीं सकते हैं। छवि को बचाने के लिए AJAX का उपयोग करें। –

+0

मैं यह कैसे कर सकता हूं? –

+1

इस पोस्ट को देखें http://www.9lessons.info/2011/08/ajax-image-upload-without-refreshing.html –

उत्तर

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

पर एक नज़र डालें:

imagerotate()

और:

file_put_contents()

+7

आपको वास्तव में ['imagepng()'] (http://www.php.net/manual/en/function) का उपयोग करने की आवश्यकता है .imagepng.php) फ़ाइल लिखने के लिए, 'file_put_contents() 'नहीं। – ggutenberg

+0

धन्यवाद। लेकिन मैं file_put_contents() का उपयोग कर घूर्णन छवि को सहेज नहीं सकता। मैंने इसके बजाय function imagejpeg() का उपयोग किया। – Juljan

+0

file_put_contents() के बजाय imagepng() या imagejpeg() का उपयोग करें। – Phuong

10

छवि रोटेशन: 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' || $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); 

यह मेरे लिए काम करता है, इसे आजमाएं।

2
<?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; 
       } 
     } 

    ?> 
संबंधित मुद्दे