Canvas 第二次draw失效,图片不显示
发布于 5 年前 作者 juan58 3917 次浏览 来自 问答

const ctx = wx.createCanvasContext(‘myCanvas’);

let canvasW = 525;

let canvasH = 420;

// 将图片绘制到画布

// drawImage(string imageResource, number dx, number dy, number dWidth, number dHeight, number sx, number sy, number sWidth, number sHeight);

ctx.drawImage(src, 0, 0, 300, 200);

//必须要用到, 并且需要在绘制成功后导出图片

ctx

.

draw(false, function() {

//  导出图片

wx.canvasToTempFilePath({

width: canvasW,

height: canvasH,

destWidth: canvasW,

destHeight: canvasH,

canvasId: ‘myCanvas’,

fileType: ‘jpg’,

success: function(res) {

// res.tempFilePath为导出的图片路径

typeof cb == ‘function’ && cb(res.tempFilePath);

console.log(“裁剪完毕”);

return false;

}

});

});

首次执行该段代码,canvas显示出图片

第二次执行该段代码,canvas不显示图片,调试发现ctx.draw()第二次没有执行,什么原因?

4 回复

坑啊

我也是想创建一个temp canvas,用完就隐藏,要用就显示,同步的设置 showCanvas 就出这个bug

刚刚发现问题就看到你提的这个

是不是 canvas用wx:if隐藏过,然后canvas实例又没有重新初始化啊?

我遇见的问题开发者工具里:第一次能绘制成功,第二次不行了!

真机预览 没任何问题

总结下我怀疑是第一次canvas对象id没有被销毁,如第二次继续使用同id就会失败

解决办法,用时间戳生成如CanvasId1560392359912,能解决我遇见的问题

感谢@卢霄霄 同学解决了我的问题QAQ

回到顶部