cropper - 如何从 Cropper 获得固定大小的裁剪

标签 cropper

我正在使用 Cropper 尝试从上传的图像中获取固定大小的裁剪。这个想法是,如果(如果需要)网站管理员将能够缩放并在无法更改的裁剪器中构建新图像。通过这种方式,所有被裁剪的图像大小完全相同。

除非用户放大,否则这会起作用。在这种情况下,生成的图像较小,如果缩小则较大。

我正在用这个初始化裁剪器:

$('#image').cropper({
        aspectRatio: 16 / 9,
        cropBoxResizable: false,
        dragMode: 'move',
        built: function () {
            $("#image").cropper('setCropBoxData', { width: 640 });
        },
        cropmove: function () {
            $("#image").cropper('setCropBoxData', { width: 640 });
        }
    });

然后使用以下方法获取用于上传的 dataUrl:
var image = $("#image").cropper("getCroppedCanvas").toDataURL('image/jpeg', 1);

看起来它是通过查看裁剪框边界的区域然后使用原始大小裁剪图像来裁剪的。换句话说,该框只是定义了图像的边界区域,然后裁剪器以原始大小从原始图像中裁剪出该区域。我需要它们是 Cropper 设置中定义的大小。

如果您需要更多,请告诉我。

最佳答案

会设置
zoomable: false,
对你的情况有帮助吗?还是要保留用户的缩放能力?

关于cropper - 如何从 Cropper 获得固定大小的裁剪,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40730887/

相关文章:

javascript - DropzoneJs : create a thumbnail after cropping image with CropperJS

javascript - Jquery 裁剪 : cropper image not changing

javascript - Cropper 在使用 dropzone js 上传之前裁剪多个图像

javascript - cropper.js 上传带有坐标的原始图像

javascript - CropperJS : Image outsite the crop box is not visible

javascript - 如何使用cropper.js对图像进行裁剪?

javascript - 如何使用cropper插件获取dataurl并将dataurl显示为图像