All geek questions in one place

Image resizing and image resizing Blue imp.

I use this plugin to upload jquery images https://github.com/blueimp/jQuery-File-Upload

I need to resize / crop the image to the size of the client, so it will have the exact height and width, and then upload to the server.

this is part of the script to load, and it works great, the only problem is that it just resizes the image without cropping, and I get the downloaded image, for example. the width is 150 px and the height says 133 px (although the height and width of the original image is more than 1000 pixels, but I want the exact height and width - 150 pixels). From the list of options, I thought that imageCrop should do the trick, https://github.com/blueimp/jQuery-File-Upload/wiki/Options#imagecrop , but it is not. Am I doing something wrong, or does the plugin not support the functionality that I need? And if so, is there any way I can achieve what I need using an external library / function using this plugin?

thanks

change

I also tried these options

  canvas: true, cover: true, crop: true, thumbnail: true, aspectRatio: '1/1'

but to no avail

 $('#fileupload').fileupload({ url: 'test.php' dataType: 'json', imageCrop: true, process: [ { action: 'load', fileTypes: /^image\/(gif|jpeg|png)$/, maxFileSize: 20000000 // 20MB }, { action: 'resize', maxWidth: 150, maxHeight: 150, minWidth: 150, minHeight: 150, imageCrop: true }, { action: 'save' }, {action: 'duplicateImage'}, { action: 'resize', maxWidth: 100, maxHeight: 100, minWidth: 100, minHeight: 100, imageCrop: true }, { action: 'save' } ], ...
+5
source share
1 answer

According to the "blueimp" manual, to execute Client side Image Resizing you need to set the disableImageResize option to false

 $('#fileupload').fileupload({ url: 'test.php', dataType: 'json', disableImageResize: false, imageMaxWidth: 800, imageMaxHeight: 800, imageCrop: true })

Link to src.

+1
source

Source: https://habr.com/ru/post/1203815/

More articles:


All Articles