描述：canvas透明画板getImageData数据后putImageData到另一个画板 导致在开发工具上新画板putImageData数据背景不透明。在真机上却又透明，如下图 canvas.getContext('2d',{ alpha: true }); const imgData1 = ctx1.getImageData(0, 0, canvas.width, canvas.height) ctx.putImageData(imgData1, canvas.width, canvas.height); mac工具图 [图片] ios真机图 [图片]

代码 https://developers.weixin.qq.com/s/3vHz98mZ7dyV mac 工具图 [图片] ios真机 [图片]

[图片] 上图是开发工具显示 [图片] 上图是iphonex 真机显示 ；保存下来后如上图第二张图 css部分 #myCanvas{ border: 1rpx solid red; width: 320rpx; height: 320rpx; margin-left: calc((100% - 320rpx) / 2); margin-top: 20rpx; } .loadingImage{ width: 320rpx; height: 320rpx; border: 1rpx solid red; margin-left: calc((100% - 320rpx) / 2); margin-top: 20rpx; } html部分 <canvas type="2d" id="myCanvas"></canvas> <image show-menu-by-longpress class="loadingImage" src="{{imgData}}"></image> <text class="top_text">长按上图保存图片</text> js部分 loadingImg: async function (img, url){ await new Promise(resolve => { img.onload = resolve; img.src = url; }); }, onReady: function () { const that = this; this.query = wx.createSelectorQuery() this.query.select('#myCanvas') .fields({ node: true, size: true }) .exec((res) => { that.canvas = res[0].node; that.ctx = that.canvas.getContext('2d'); const image = that.canvas.createImage(); that.loadingImg(image,'/img/tx-1.png').then(()=>{ that.ctx.drawImage(image, 0, 0, that.canvas.width,that.canvas.height); setTimeout(()=>{ wx.canvasToTempFilePath({ canvas: that.canvas, success(res) { that.setData({imgData: res.tempFilePath}); console.log(that.data.imgData) }, fail(err) { console.log(err) } }) },100); }); }); }