jQuery cropper插件 - 旋转和缩放不能同时工作

Question

如果有人去了fengyuanchen cropper并做了类似的事情：点击ScaleX（或scaleY），然后点击旋转，裁剪器不工作，选择的区域不正确。请记住，只需在“缩放”中单击一次，这是getSourceCanvas函数，用于管理裁剪器操作。但是为了修复我无法看出哪里出错了。有些事情是错的，这是肯定的。

function getSourceCanvas(image, data) {
    var canvas = $('<canvas>')[0];
    var context = canvas.getContext('2d');
   var dstX = 0;
   var dstY = 0;
   var dstWidth = data.naturalWidth;
   var dstHeight = data.naturalHeight;
   var rotate = data.rotate;
   var scaleX = data.scaleX;
   var scaleY = data.scaleY;
   var scalable = isNumber(scaleX) && isNumber(scaleY) && (scaleX !== 1 || scaleY !== 1);
   var rotatable = isNumber(rotate) && rotate !== 0;
   var advanced = rotatable || scalable;
   var canvasWidth = dstWidth * abs(scaleX || 1);
   var canvasHeight = dstHeight * abs(scaleY || 1);
   var translateX;
   var translateY;
   var rotated;

  if (scalable) {
    translateX = canvasWidth / 2;
    translateY = canvasHeight / 2;
  }

 if (rotatable) {
   rotated = getRotatedSizes({
     width: canvasWidth,
     height: canvasHeight,
     degree: rotate
   });

   canvasWidth = rotated.width;
   canvasHeight = rotated.height;
   translateX = canvasWidth / 2;
   translateY = canvasHeight / 2;
 }

 canvas.width = canvasWidth;
 canvas.height = canvasHeight;

 if (advanced) {
   dstX = -dstWidth / 2;
   dstY = -dstHeight / 2;

   context.save();
   context.translate(translateX, translateY);
 }

 if (rotatable) {
   context.rotate(rotate * Math.PI / 180);
 }

 // Should call `scale` after rotated
 if (scalable) {
   context.scale(scaleX, scaleY);
 }


 context.drawImage(image, floor(dstX), floor(dstY), floor(dstWidth), floor(dstHeight));

 if (advanced) {
   context.restore();
 }

  return canvas;
}