裁剪图像会显示空白图像

Question

您好我正在尝试使用codeigniter，jQuery（ui.js）裁剪图像。虽然图像正在裁剪但在裁剪后显示黑色图像。我做了一个名为 crop_div 的给定，div实际上有一些边框和宽度高度。我正在做的是我使用jquery访问这个div的坐标，将它们发送到php，调用上一个上传的图像并从上传的图像中获取相同的坐标。这是代码

JS代码

function do_crop(method_url) {
    jQuery('#do_crop').on('submit', (function(e) {
        e.preventDefault();
        var posi = document.getElementById('crop_div');
        var top = document.getElementById("top").value=posi.offsetTop;
        var left = document.getElementById("left").value=posi.offsetLeft;
        var right = document.getElementById("right").value=posi.offsetWidth;
        var bottom = document.getElementById("bottom").value=posi.offsetHeight;
        jQuery.ajax({
            url: method_url,
            type: 'POST',
            data: { 'top': top, 'left': left, 'bottom': bottom, 'right': right },
            success: function(data) {
                jQuery('.result').show();
                if(data == 'Profile uploaded.') {
                    window.location.href = reload;
                    jQuery('#PicprofileBtn').html('Submit');
                }
                else {
                    alert(data);
                }
            }
        });
    }));
}

PHP代码

        public function do_crop() {

        $y1 = $this -> input -> post('top');
        $x1 = $this -> input -> post('left');
        $w = $this -> input -> post('right');
        $h = $this -> input -> post('bottom');

        $image = "Users_Data/profile/8ca760ccc0bf60566fdd4ccc2cd213e8.jpg";

        list($width,$height ) = getimagesize( $image );
        $newwidth = 600;
        $newheight = 400;

        $thumb = imagecreatetruecolor( $newwidth, $newheight );
        $source = imagecreatefromjpeg($image);

        imagecopyresized($thumb, $source, 0, 0, 0, 0, $newwidth, $newheight, $width, $height);
        imagejpeg($thumb,$image,100); 


        $im = imagecreatefromjpeg($image);
        $dest = imagecreatetruecolor($w,$h);

        imagecopyresampled($dest,$im,0,0,$x1,$y1,$w,$h,$w,$h);
        imagejpeg($dest,"Users_Data/thumb/crop_image.jpg", 100);

    }