收藏
回答

提出问题,canvas中draw无法进入回调,canvasToTempFilePath一直走fail

框架类型 问题类型 API/组件名称 终端类型 微信版本 基础库版本
小程序 Bug ctx.draw 微信安卓客户端 7.0.22 2.14.3

cutawayCanvasFn(_this) {

      let that = this;

      console.log(`createCanvasContext image-canvas`)

      const ctx = wx.createCanvasContext("image-canvas",that);

      console.log('ctx',ctx)

      // that.canvas = uni.createCanvasContext("image-canvas", that);

      // 获取屏幕的宽高,对图片进行剪裁准备

      wx.getSystemInfo({

        success(res) {

          console.log('获取屏幕的宽高',res)

          let windowWidth = res.windowWidth;

          let windowHeight = res.windowHeight;

          that.windowWidth = windowWidth;

          that.windowHeight = windowHeight;

          wx.getImageInfo({

            src: that.ocrImgUrl,

            success(res) {

              console.log('获取图片信息',res)

              //过渡页面中,图片的路径坐标和大小

              ctx.drawImage(that.ocrImgUrl,0,0,windowWidth,windowHeight);

              let newX = (windowWidth - 335) / 2;

              let newY = windowHeight / 2 - 129;

              let newWidth = 335;

              let newHeight = 129;

              // ctx.setStrokeStyle("red"); // 描边

              ctx.strokeRect(newXnewYnewWidthnewHeight); // 裁切

              ctx.restore()

              ctx.draw(falsefunction(res){

                console.log(`that.canvas.draw sueccess`,res)

              });

              setTimeout(() => {

                wx.hideLoading()

                console.log('剪裁开始',_this,that,that.canvas)

                wx.canvasToTempFilePath({

                  //裁剪对参数

                  x: newX//画布x轴起点

                  y: newY//画布y轴起点

                  width: newWidth//画布宽度

                  height: newHeight//画布高度

                  destWidth: newWidth//输出图片宽度

                  destHeight: newHeight//输出图片高度

                  canvasId: "image-canvas",

                  success(res) {

                    that.filePath = res.tempFilePath;

                    that.newImageSrc = res.tempFilePath;

                    //清除画布上在该矩形区域内的内容。

                    that.canvas.clearRect(00windowWidthwindowHeight);

                    that.canvas.drawImage(

                      that.filePath,

                      newX,

                      newY,

                      newWidth,

                      newHeight

                    );

                    that.canvas.draw();

                    //在此可进行网络请求

                    // that.SaveVehicleImage(that.newImageSrc);

                  },

                  fail(e) {

                    console.log(e)

                    wx.hideLoading();

                    wx.showToast({

                      title: "出错啦...",

                      icon: "loading"

                    });

                  }

                },that);

              }, 5000);

            }

          });

        }

      });

    },



回答关注问题邀请回答
收藏

1 个回答

  • 拾柒
    拾柒
    2021-01-18

    that上有这个方法? 不应该是ctx.

    2021-01-18
    有用
    回复
登录 后发表内容
问题标签