如何使用jquery imgAreaSelect和php裁剪图片？

Question

我使用以下JavaScript代码来实例化jQuery imgAreaSelect 来裁剪我的图像。

$(document).ready(function () {
    $('#ladybug').imgAreaSelect({
        onSelectEnd: function (img, selection) {
            $('input[name="x1"]').val(selection.x1);
            $('input[name="y1"]').val(selection.y1);
            $('input[name="x2"]').val(selection.x2);
            $('input[name="y2"]').val(selection.y2);            
        }
    });
});

这与以下（示例）HTML代码相关：

<div>
    <img id="ladybug" src="ladybug.jpg" alt="" />
</div>

<div>
   <form action="#" method="post">
      <input id="x1" type="hidden" name="x1" value="" />
      <input id="y1" type="hidden" name="y1" value="" />
      <input id="x2" type="hidden" name="x2" value="" />
      <input id="y2" type="hidden" name="y2" value="" />
      <input type="submit" name="submit" value="Submit" />
   </form>
</div>

这个工作非常完美，当提交表单时，我可以得到所有正确的信息。然而，现在我必须使用PHP根据表单发送的坐标修改图像。这比我想象的要困难。

$image_info = getimagesize($filename);
$image = imagecreatefromjpeg($filename);

$width = imagesx($image);
$height = imagesy($image);

$resized_width = ((int)$formData["x2"]) - ((int)$formData["x1"]);
$resized_height = ((int)$formData["y2"]) - ((int)$formData["y1"]);

$resized_image = imagecreatetruecolor($resized_width, $resized_height);
imagecopyresampled($resized_image, $image, 0, 0, (int)$formData["x1"], (int)$formData["y1"], $resized_width , $resized_height, $width, $height);
imagejpeg($resized_image, $filename);

上面的脚本虽然可以工作，但是它使用了错误的坐标/宽度/高度。我总是在调整大小后的图像中留下一个大黑边框:

有人能指导我正确的方向吗？

- RTB

Answer 1

将以imagecopyresampled开头的行替换为以下内容即可：

imagecopyresampled($resized_image, $image, 0, 0, (int)$formData["x1"], (int)$formData["y1"], $width, $height, $width, $height);

imagecopyresampled()函数将从源图像src_image的位置(src_x,src_y)截取一个宽度为src_w、高度为src_h的矩形区域，并将其放置在目标图像dst_image的位置(dst_x,dst_y)处，目标图像的宽度为dst_w，高度为dst_h。

- Memet Olsen