公告列表
公告列表
收藏
回答

canvas 画多张照片的时候 有时候会出现画不上去的问题?



70% -80%时候是好的

偶尔就会出现图片没有画好也进入callback了

图片都已经getImageInfo 获取临时路径了

有遇到过同样问题的朋友吗






补充:

这里是循环进来的 数据 photoSrc的数量是1-6



补充:

感谢 Xiushan Li 的解答


我们把白色的方框看做拼图的图片位置

紫色位置为边框  层级是最高的

图片只能放在边框里 互相不影响 图片可以移动 放大




最后一次编辑于  2019-09-06
回答关注问题邀请回答
收藏

5 个回答

  • 2019-09-06

    我以前也碰到过，个人认为是canvasToTempFilePath接口的调用会影响下一次的draw,你可以试试在canvasToTempFilePath的成功回调后resolve再进行下一次draw

    2019-09-06
    有用
    回复 4
    • 💮店長推薦.
      💮店長推薦.
      2019-09-06
      我是不停的在drawImage 之后Draw 最终canvasToTempFilePath 这个api已经生成照片了 不需要在draw了呀
      2019-09-06
      赞
      回复
    • 2019-09-06回复💮店長推薦.
      问下第一次画的图片是不是百分百好的(指编译后的第一次绘画)
      2019-09-06
      赞
      回复
    • 2019-09-06回复💮店長推薦.
      我以前碰到的是draw之后马上调用canvasToTempFilePath，下一次draw的图片基本都会出问题，如果你编译后第一次画没问题的肯定是被这个canvasToTempFilePath影响了，看看能不能把canvasToTempFilePath也加进promise，整个流程走完后再允许下一次绘制
      2019-09-06
      赞
      回复
    • 2019-09-06回复💮店長推薦.
      感觉你没理解我的意思，你这里的70、80%指的是不是数次生成了这个图片，如果你每次循环draw后直接调用canvasToTempFilePath，然后再紧接着下一次循环draw，那么我可以负责任的告诉你，再次draw出来的图片是有几率出现问题的，因为我本人碰到过，不是很清楚你那边的具体逻辑，不过相信不相信这个影响完全取决于你
      2019-09-06
      赞
      回复
  • 邱一欢
    邱一欢
    2019-09-05

    图片都sync完以后 一起画上去。 draw都是异步的， 调多了有时候会掉。

    如果嫌用户体验不好，就先画一个骨架， 然后sync图片， 最后一起画上去

    2019-09-05
    有用
    回复 2
    • 💮店長推薦.
      💮店長推薦.
      2019-09-05
      由于有层级概念 所以不能一起画上去
      2019-09-05
      赞
      回复
    • 💮店長推薦.
      💮店長推薦.
      2019-09-05
      drawImage 如果不调用draw 没办法保存图片啊 上一次的绘图不会保存下来
      2019-09-05
      赞
      回复
  • Xs
    Xs
    2019-09-05

    回调放个setTimeout

    tempCtx.draw(true, setTimeout(() =>{resolve()},500)

    2019-09-05
    有用
    回复 12
    • 💮店長推薦.
      💮店長推薦.
      2019-09-05
      我试试 我在画最终的边框的时候 用延时器了 画图的时候确实没用
      2019-09-05
      赞
      回复
    • 💮店長推薦.
      💮店長推薦.
      2019-09-05
      试了一下 还是偶尔会有
      2019-09-05
      赞
      回复
    • Xs
      Xs
      2019-09-05回复💮店長推薦.
      这应该是canvas渲染问题，你现在的业务是做什么
      2019-09-05
      赞
      回复
    • 💮店長推薦.
      💮店長推薦.
      2019-09-05回复Xs
      模仿美图秀秀的拼图
      2019-09-05
      赞
      回复
    • Xs
      Xs
      2019-09-05回复💮店長推薦.

      你可以做个替代方案，最后画完，把当前canvas保存临时图片文件，然后在页面放个image组件，作为替代展示：

      ctx.draw(true, setTimeout(() => {
                  wx.canvasToTempFilePath({
                    canvasId: '',
                    success: res => {
                      console.log(res.tempFilePath) //赋值给image组件的src
                    }
                  }, this)
                }, 500))


      2019-09-05
      赞
      回复
    查看更多(7)
  • o0o有脾气的酸奶
    o0o有脾气的酸奶
    2019-09-05

    https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html

    按这个弄个 能复现的 代码片段 分享上了


    2019-09-05
    有用
    回复 8
    查看更多(3)
  • 💮店長推薦.
    💮店長推薦.
    2019-09-05

    这些canvas的api还有异步的吗 应该没有了吧

    2019-09-05
    有用
    回复
请 登录 后发表内容
相关问题
相关文档
问题标签
canvas照片路径getimageinfo图片