JS 플러그인을 사용하여 이미지 자르기 | PhoneGap

iOS에서 PhoneGap을 처음 사용하면서 imgAreaSelect JS 플러그인을 사용하여 이미지를 자르지 못했습니다. 이 코드는 웹 브라우저에서 잘 작동하지만 iOS 시뮬레이터에는 변경 사항이 표시되지 않습니다. 사용 지역 folder.The 코드에서 수입되는 이미지는 다음과 같습니다 :JS 플러그인을 사용하여 이미지 자르기 | PhoneGap | iOS

$('#testimg').imgAreaSelect({ 
handles: true, 
aspectRatio: '16:9' 
});

는 다른 방법은 폰갭을 사용하여 이미지가자를 수 있으면 알려 주시기 바랍니다? 이것은 웹 브라우저에서 보이며 iOS 시뮬레이터에서는 나타나지 않습니다. enter image description here

출처

2014-07-15 apen

플러그인 imgAreaSelect가 작동하지 않는 것 같습니다. 나는 JCrop-http://deepliquid.com/content/Jcrop.html을 시도했으며 완벽하게 정상적으로 작동한다. 그들은 iOS, Android 등을위한 터치 지원을 명시 적으로 언급합니다. 링크의 데모를 따라 가십시오.

출처

2014-07-16 00:50:35 rumshenoy

Jcrop Does'nt support touch event in phone gap so there is no need to use I have spend 3 hour on it. I just want to crop after upload image from camera or salary in phonegap. I use following it is working fine.

https://github.com/acornejo/jquery-cropbox

<?php 

if ($_SERVER['REQUEST_METHOD'] == 'POST') { 
    $targ_w = 640; 
    $targ_h=280; 
    $jpeg_quality = 90; 

    $save=dirname(__FILE__).'/files/abcd.jpg'; 
    $src = dirname(__FILE__).'/img/img.jpg'; 
    $img_r = imagecreatefromjpeg($src); 
    $dst_r = ImageCreateTrueColor($targ_w, $targ_h); 
    imagecopyresampled($dst_r,$img_r,0,0,$_POST['x'],$_POST['y'],$targ_w,$targ_h,$_POST['w'],$_POST['h']); 
    header('Content-Type: image/jpeg'); 
    imagejpeg($dst_r,null ,$jpeg_quality); 

    exit; 
} 
?> 
<!DOCTYPE html> 
<!-- saved from url=(0041)http://acornejo.github.io/jquery-cropbox/ --> 
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
    <title>jQuery-cropbox</title> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1"> 
    <link type="text/css" media="screen" rel="stylesheet" href="js/jquery.cropbox.css"> 
    <script type="text/javascript" src="js/jquery.min.js"></script> 
    <script type="text/javascript" src="js/hammer.js"></script> 
    <script type="text/javascript" src="js/jquery.cropbox.js"></script> 
    <script type="text/javascript" defer=""> 
    $(function() { 
    $(function() { 
    var r = $('#results'), 
     x = $('.cropX', r), 
     y = $('.cropY', r), 
     w = $('.cropW', r), 
     h = $('.cropH', r); 

    $('#cropimage').cropbox({ 
     width: 500, 
     height: 240 
    }).on('cropbox', function (event, results, img) { console.log("on crop"); 
     x.text(results.cropX); 
     y.text(results.cropY); 
     w.text(results.cropW); 
     h.text(results.cropH); 
     $("#x").val(results.cropX); 
     $("#y").val(results.cropY); 
     $("#w").val(results.cropW); 
     $("#h").val(results.cropH); 

    }); 
}); 
}); 
    </script> 
</head> 
<body> 
<form action="index.php" method="post" onsubmit="return checkCoords();"> 
      <div style="width:100%;"> 
      <img id="cropimage" alt="" src="img/img.jpg" /> 
     </div> 
     <div id="results"> <b>X</b>: 
     <span class="cropX"></span> 
     <b>Y</b>: <span class="cropY"></span> 
     <b>W</b>: <span class="cropW"></span> 
     <b>H</b>: <span class="cropH"></span> 


        <input type="text" name="x" id="x" size="4" /> 
        <input type="text" name="y" id="y" size="4" /> 
        <input type="text" name="w" id="w" size="4" /> 
        <input type="text" name="h" id="h" size="4" /> 

     </div> 
     <input type="submit" /> 
</form> 

</body></html>

출처

2016-09-22 08:55:13

JS 플러그인을 사용하여 이미지 자르기 | PhoneGap | iOS

답변

관련 문제