收藏
回答

canvas 2d导出第一张图片时空白,是代码问题?

用户上传的图片中第一张有可能是空白的图片,很奇怪,感觉是代码问题,ctx.drawImage后需要延迟调用canvasToTempFilePath吗?

wx.createSelectorQuery()
  .select('#canvas')
  .fields({node: true, size: true})
  .exec((res) => {
    const canvas = res[0].node
    let dpr = wx.getSystemInfoSync().pixelRatio;
    dpr = dpr > 2 ? 2 : dpr
    canvas.width = this.cWidth * dpr
    canvas.height = this.cHeight * dpr
    const ctx = canvas.getContext('2d')
    const img = canvas.createImage()
    img.src = tempFilePaths[0]
    img.onload = () => {
      ctx.drawImage(img, 0, 0, this.cWidth * dpr, this.cHeight * dpr)
      wx.canvasToTempFilePath({canvas, success: (res) => {
          ...
      }})
    }
  })
回答关注问题邀请回答
收藏

6 个回答

  • 小团团
    小团团
    2023-11-24

    感谢感谢,在ctx.drawImage之后加了延时问题就解决了

    2023-11-24
    有用
    回复
  • 周三岁
    周三岁
    2023-05-05

    楼主,请问问题解决了吗?我最近也遇到了同样的问题?

    2023-05-05
    有用
    回复 1
    • momo
      momo
      2023-05-05
      评论里有说wx.canvasToTempFilePath外包裹settimeout 400ms可以解决。具体我没试过,因为我改成直接上传图片到服务器再压缩
      2023-05-05
      回复
  • 呱呱
    呱呱
    2023-02-17

    我得也是这样的,首次截图是空白 资源图片 画布宽高都有



    2023-02-17
    有用
    回复
  • wj
    wj
    2022-05-11
    wx.canvasToTempFilePath
    这个加个定时器就行了 我这边测出  最少要400毫秒
    
    2022-05-11
    有用
    回复 1
    • momo
      momo
      2022-05-11
      给你点赞,下次有机会试试。
      我已经改成直接上传了。
      2022-05-11
      回复
  • y40,
    y40,
    2022-05-09

    https://developers.weixin.qq.com/miniprogram/dev/api/canvas/wx.canvasToTempFilePath.html

    把当前画布指定区域的内容导出生成指定大小的图片。在 draw() 回调里调用该方法才能保证图片导出成功。

    2022-05-09
    有用
    回复 1
    • momo
      momo
      2022-05-09
      2d接口不需要调用draw的
      2022-05-09
      回复
  • 武曲心
    武曲心
    2022-05-09

    你没确认一下这张图片是不是空白?

    2022-05-09
    有用
    回复 6
    • momo
      momo
      2022-05-09
      是拍照,不会是空白的。  10个iphone上传图片有一两个第一张图片是空白的,第二张正常。   找了10几个空白图都是iphone,没有android。
      2022-05-09
      回复
    • momo
      momo
      2022-05-09
      2022-05-09
      回复
    • 武曲心
      武曲心
      2022-05-09回复momo
      确认一下是不是提交图片的逻辑有问题,还有确认下图片的尺寸是不是超了像素限制,2d真机是有限制的
      2022-05-09
      回复
    • momo
      momo
      2022-05-09回复武曲心
      cWidth=800,高度根据图片同比缩放的。像素不会超的。
      你也是画图片后直接导出吗? 需要setTimeout下再导出吗?
      2022-05-09
      回复
    • 武曲心
      武曲心
      2022-05-09回复momo
      你打印drawImage的imageSoucre参数,有没有就知道了
      2022-05-09
      回复
    查看更多(1)
登录 后发表内容