cropper canvas not working with larger files

[Praveen Pathak]

the function is not working for the larger image can you help how to fix it?

function image_crop() {
if(cropperImageInitCanvas.cropper){
var cropcanvas = cropperImageInitCanvas.cropper.getCroppedCanvas({width: 1000, height: 1000});
img = cropperImageInitCanvas.cropper.url;

// document.getElementById('cropImages').appendChild(cropcanvas);
var ctx=cropcanvas.getContext('2d');
var imgData=ctx.getImageData(0, 0, cropcanvas.width, cropcanvas.height);
// var image = document.getElementById(c);
c.width = cropcanvas.width;
c.height = cropcanvas.height;
var ctx = c.getContext('2d');
ctx.putImageData(imgData,0,0);
cropper.getCroppedCanvas().toBlob(function (blob) {
console.log(blob);

        var formData = new FormData();
        formData.append('szProfilePic', blob);
        formData.append('isProfile', true);
        setTimeout(function(){
        $.ajax("<?php echo url('/'); ?>/mymethod", {
          method: "POST",
          allowedTypes: "jpg,png,gif,jpe,jpeg,JPEG,JPG,PNG",
          data: formData,
          cache:false,
          multiple: false,
          processData: false,
          contentType: false,
          success: function (data) {
              data = JSON.parse(data);
              
              if(data)
              {

                 alert('sucess');
              }
          },
          error: function () {
            $('#cemetery-full-page-loader').hide();
           // console.log('Upload error');
           $('#fileuploader2').val(''); 
           $('#cropped_result').attr('src', '');

          }
        });
        }, 1000);
        // Use `jQuery.ajax` method
        
  });

cropperImageInitCanvas.cropper.destroy();
cropperImageInitCanvas.width = 0;
cropperImageInitCanvas.height = 0;
cropImageButton.style.display = 'none';
var allCloseButtons = document.querySelectorAll('.singleImageCanvasCloseBtn');
for (let element of allCloseButtons) {
  element.style.display = 'block';
}
urlConversion();
// cropperImageInitCanvas.style.display = 'none';

} else {
alert('Please select any Image you want to crop');
}

[Fengyuan Chen]

For large images, maybe you have to compress it before using the Cropper.

https://github.com/fengyuanchen/cropperjs#known-issues