首页 > 解决方案 > 移动/ipad 上的图像自动旋转到 90 度问题

问题描述

在我的流星应用程序中,我使用 Filterous 2 进行图像处理,但是当我尝试从 ipad/iphons 对大图像(ImageWidth>1000)应用效果时。应用效果后,图像会旋转 90 度。

在画布上绘制图像的过滤代码,我试图改变 ctx.transform 但没有运气:

function importImage(image) {
      var _this = this;

      if ((typeof window === 'undefined' ? 'undefined' : _typeof(window)) === 'object') {
        // browser
        this.canvas = document.createElement('canvas');
        this.w = this.canvas.width = image.naturalWidth * this.scale;
        this.h = this.canvas.height = image.naturalHeight * this.scale;
        this.ctx = this.canvas.getContext('2d');
        //MY TRY this.ctx.transform(0, 1, -1, 0, this.h, 0);
        this.ctx.drawImage(image, 0, 0, this.w, this.h);
        console.log( this.canvas);
      } else {
        (function () {
          var img = _this.initImage();
          img.onload = function () {
            _this.w = img.width * _this.scale;
            _this.h = img.height * _this.scale;
            _this.canvas = new Canvas(_this.w, _this.h);
            _this.ctx = _this.canvas.getContext('2d');
            _this.ctx.drawImage(img, 0, 0, _this.w, _this.h);
          };
          img.src = image;
        })();
      }
      return this;
    }

标签: javascriptmeteorrotationhtml5-canvasimage-rotation

解决方案


推荐阅读