关于jcrop裁剪的问题

Question

请教各位，

上传的图片中，如果按照原始图片来获取裁剪的坐标，是没有问题的，

但是有时图片过大，页面显示不全，在style中增加witdh="100%"的自适应的方式，

但是获取的 x y w h 坐标宽高就不对了，需要得到正确的缩放比例，

那么问题就来了，如何能够拿到这个缩放比例？
----

找到解决方案了，

1、jcrop的api可以拿到实际显示的 w h， 
$('#displayImg').Jcrop({
                    setSelect: [ 20, 60, 200, 200 ],
                    maxSize :[600,600],
                    minSize :[20,20],
                    touchSupport : true,
                      aspectRatio: 1,
                        onSelect: updateCoords
},function(){
api = this;
var ss = api.getBounds();
$('#realW').val(ss[0]);
$('#realH').val(ss[1]);
}
           );

 function updateCoords(c){
        $('#x').val(c.x);
$('#y').val(c.y);
$('#w').val(c.w);
$('#h').val(c.h);  
};

2、html部分，通过隐藏表单向后台传递：
  <form id="coords" target="hid_frame" action="<%=path %>/uploadImg" method="post" data-role="none" enctype ="multipart/form-data">
    <input class="photo-file" type="file" name="imgFile" id="fcupload" onchange="readURL(this);"/>
    <input type="hidden" id="x" name="x" />
<input type="hidden" id="y" name="y"/>
<input type="hidden" id="w" name="w"/>
<input type="hidden" id="h" name="h"/>
<input type="hidden" id="realW" name="realW"/>
<input type="hidden" id="realH" name="realH"/>
    <input type="submit" value="上传" id="upload"/>
    </form>
3、java后台部分，x的比例 = 原图尺寸w/显示尺寸w，y的比例也是如此计算，这里我使用BigDecimal，来处理精度问题； 

Answer 1

我建义你使shearphoto，是秒杀了
jcrop
 了  自己百度吧，用了shearphoto，其他截图工具，保证你不会再用了

Answer 2

如果图片太大，可以在上传时在服务端将图片宽度限制在一定范围内，这样在前台显示就没问题了

Answer 3

这个是没问题的，但是如果你是手机浏览的话，不能让图片自适应是不行的，所以如何拿到缩小的比例，或者缩小后的宽度和高度，根据比例再计算一次

Answer 4

这问题我也遇到了，我的解决方案是不要对图片设置宽度，让图片自然显示。