看了很多帖子,不能直接把网络图片画到画布上,需要用wx.getImageInfo()将网络图片放在缓存里再画,可是还是不行啊
drawImg () { var _this = this const path1 = this .pageBg const path2 = this .QRCode const ctx = wx.createCanvasContext( 'shareCanvas' ) const QRSize = 120 wx.getImageInfo({ src: path1, success: function (res) { ctx.drawImage(res.path, 0, 0, 345, 588) } }) wx.getImageInfo({ src: path2, success: function (res) { ctx.drawImage(res.path, (345 - QRSize) / 2, 400, QRSize, QRSize) } }) ctx.draw( true , setTimeout(() => { wx.canvasToTempFilePath({ x: 0, y: 0, width: 345, height: 588, destWidth: 345, destHeight: 588, canvasId: 'shareCanvas' , success: function (res) { console.log(res.tempFilePath) _this.finalImgUrl = res.tempFilePath }, fail: res => { console.log(res) } }) }, 2000)) }, |
draw很可能比getImageInfo.success先执行,怎么画得出来
drawImg () {
var _this = this
const ctx = wx.createCanvasContext('shareCanvas')
const QRSize = 120
wx.getImageInfo({
src: _this.pageBg,
success: function (res) {
console.log(res.path)
ctx.drawImage(res.path, 0, 0, 345, 588)
}
})
wx.getImageInfo({
src: _this.QRCode,
success: function (res) {
console.log(res.path)
ctx.drawImage(res.path, (345 - QRSize) / 2, 400, QRSize, QRSize)
}
})
setTimeout(() => {
ctx.draw()
}, 2000)
},
因为要画两张图片,所以很头疼,请帮忙看看
楼主 解决了么 我现在网络图片方本地用临时路径 也不显示图片
将网络图片放到本地,用临时路径