canvas 的图为啥显示不了 base64的显示不出来
let promiseImg = new Promise(function (resolve, reject) {
wx.getImageInfo({
src: cover,
success: function (cover) {
resolve(cover.path)
console.log(cover)
}
})
})
promiseImg.then(function (cover) {
that.setData({
cover:cover
})
ctx.drawImage(cover, 0, 0, 320, 170);
})
getImageInfo返回本地的路径也显示不到canvas上如果吧路径放到img上就能显示
let that = this;
console.log(that.data.imgPath)
const ctx = wx.createCanvasContext('myCanvas');
ctx.drawImage(that.data.imgPath, 0, 0, 150, 150);
ctx.draw(true, function () {
wx.canvasToTempFilePath({
x: 0,
y: 0,
width: 150,
height: 150,
destWidth: 150,
destHeight: 150,
canvasId: 'myCanvas',
success: function (res) {
console.log(res.tempFilePath)
wx.saveImageToPhotosAlbum({
filePath: res.tempFilePath,
success(res) {
console.log(res)
}, fail(res) {
console.log(res)
}
})
}, fail(res) {
console.log('canvasToTempFilePath', res)
}
})
});
我也是遇到同样的问题,开发工具能显示图片,保存图片,到真机就不能显示图片到画布上面了,that.data.imgPath 是图片base64内容, 要是正常图片路径就可以显示,base64真机显示不了到画布, 我的手机机型是 小米6,微信版本6.7.2
缺个draw(),在html的canvas里画图只要drawImage就行了,但是小程序的要加上draw(),官方文档截图:
没用
如果是本地图片,可以直接画。如果是网络图片,需要downloadFile了之后画(download需要加白名单)。如果是base64,暂时只能转成本地图片了画。如果你不存在以上的情况,贴下你代码呢?
就是base64图片canvas展示问题的具体解决办法
主要就是用 FileSystemManager.writeFile 把 base64转成本地文件呢。。不过没真试过。。反过来的倒是有不少人在用