Javascript 丰原陈庄稼人的庄稼是椭圆形的吗?

Javascript 丰原陈庄稼人的庄稼是椭圆形的吗?,javascript,canvas,Javascript,Canvas,裁剪圆时,我尝试设置crapper.setAspectRatio(0)允许我自由拖动以获得椭圆形状,但当它裁剪时,我最终得到的是圆形裁剪,但透明的边填充了额外缺少的信息。此图像应为width=722px height=182px 下面是获取圆形画布的函数,该函数适用于完美的圆形,但不适用于椭圆: function getRoundedCanvas(sourceCanvas) { var canvas = document.createElement('canvas'); var con

裁剪圆时,我尝试设置
crapper.setAspectRatio(0)
允许我自由拖动以获得椭圆形状,但当它裁剪时,我最终得到的是圆形裁剪,但透明的边填充了额外缺少的信息。此图像应为
width=722px height=182px

下面是获取圆形画布的函数,该函数适用于完美的圆形,但不适用于椭圆:

function getRoundedCanvas(sourceCanvas) {
  var canvas = document.createElement('canvas');
  var context = canvas.getContext('2d');
  var width = sourceCanvas.width;
  var height = sourceCanvas.height;
  canvas.width = width;
  canvas.height = height;
  context.imageSmoothingEnabled = true;
  context.drawImage(sourceCanvas, 0, 0, width, height);
  context.globalCompositeOperation = 'destination-in';
  context.beginPath();
  context.arc(width / 2, height / 2, Math.min(width, height) / 2, 0, 2 * Math.PI, true);
  context.fill();
  return canvas;
}

我能够对其进行一些修改以使其正常工作:

function getRoundedCanvas(sourceCanvas) {
  var canvas = document.createElement('canvas');
  var context = canvas.getContext('2d');
  offsetTop = Math.round(cropper.getCropBoxData().top);
  offsetLeft = Math.round(cropper.getCropBoxData().left);  
  var width = sourceCanvas.width;
  var height = sourceCanvas.height;
  canvas.width = width;
  canvas.height = height;
  context.imageSmoothingEnabled = true;
  context.drawImage(sourceCanvas, 0, 0, width, height);
  context.globalCompositeOperation = 'destination-in';
  context.beginPath();
  context.ellipse(width/2, height/2, width/2, height/2, 0 * Math.PI, 0, 45 * Math.PI);
  context.fill();
  return canvas;
}