Javascript 如何翻转&；在HTML5画布上旋转图像

我正在开发一个电子应用程序，它可以在工业打印机上批量打印图像，我遇到了图像翻转/镜像的问题

这是我的代码，它决定了一个图像应该翻转、旋转还是两者都翻转

  _createClass(Image, null, [{
    key: 'drawRotatedImage',
    value: function drawRotatedImage(canvas, image, angle, mirrorImage) {
       var context = canvas.getContext('2d');
      if (angle > 0) {
        context.rotate(angle * (Math.PI / 180));
      }
      if (mirrorImage === true) {
        context.scale(-1, 1);
        context.drawImage(image, -image.width, -image.height, image.width, image.height);
      } else {
        context.drawImage(image, 0, angle === 0 ? 0 : -image.height);
      }
      return canvas;
    }
  },

代码的第一部分识别图像是否需要旋转。这个很好用。但是，对于不需要旋转的图像，“mirrorImage”功能无法正常工作。在旋转的图像上，一切都能完美地工作。我错过什么了吗？谁能帮我个忙，这已经让我发疯好几个小时了

谢谢

值：函数DrawRotateImage（画布、图像、角度、镜像图像）{
var context=canvas.getContext（'2d'）；
如果（角度>0）{
旋转（角度*（Math.PI/180））；
}
if（mirrorImage==真）{
如果（角度>0）{
背景量表（-1,1）；
context.drawImage（image，-image.width，-image.height，image.width，image.height）；
}
} 
if（mirrorImage==真）{
如果（角度<1）{
背景量表（-1,1）；
context.drawImage（image，-image.width，0，image.width，image.height）；
}
}否则{
context.drawImage（图像，0，角度===0？0:-image.height）；
}
返回画布；
}

您到底想要实现什么目标有点不清楚。我假设您希望图像在适当的位置翻转和/或旋转？但是在代码中，图像是围绕画布的原点旋转的，而不是每个图像的中心。更新。我终于把它修好了。我缺少一个IF来表示，如果一个图像处于0度（横向）并且需要镜像，那么只镜像图像而不旋转。代码如下。

value: function drawRotatedImage(canvas, image, angle, mirrorImage) {
    var context = canvas.getContext('2d');
    if (angle > 0) {
        context.rotate(angle * (Math.PI / 180));
    }
    if (mirrorImage === true) {
        if (angle > 0) {
            context.scale(-1, 1);
            context.drawImage(image, -image.width, -image.height, image.width, image.height);
        }
    } 

    if (mirrorImage === true) {
        if (angle < 1) {
            context.scale(-1, 1);
            context.drawImage(image, -image.width, 0, image.width, image.height);
        }
    } else {
        context.drawImage(image, 0, angle === 0 ? 0 : -image.height);
    }
    return canvas;
}