我正在使用cropper.js ( https://github.com/fengyuanchen/cropperjs ) 来操作图像,但我找不到以编程方式裁剪图像的方法。
我想要做的是在初始化裁剪器后立即创建裁剪预览。
var cropper = new Cropper(document.getElementById('img'), {
autoCrop: true,
autoCropArea: 1,
aspectRatio: 500 / 660,
minCropBoxWidth: 500,
minCropBoxHeight: 660,
viewMode: 2
});
我启用了
autoCrop
,但是如果我尝试使用 cropper.getCroppedCanvas()
获取数据,它会返回 null
。我注意到
cropper.cropped
是假的,所以我可能需要触发初始裁剪,但不知道如何触发。
最佳答案
我意识到我试图过早地生成预览图像。
问题是 cropper
还没有完全初始化。
当 ready
被触发时调用逻辑修复它:
var cropper = new Cropper(document.getElementById('img'), {
autoCrop: true,
autoCropArea: 1,
aspectRatio: 500 / 660,
minCropBoxWidth: 500,
minCropBoxHeight: 660,
viewMode: 2,
ready: function() {
generatePreview();
}
});
关于Cropper.js 以编程方式裁剪,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50313763/