wx.canvasGetImageData 在真机上读取的数据失真,怎么解决?
调用相机拍照后,将相片保存到本地;再打开照片读取照片的像素值,在真机上失真,请问怎么解决???急............ 注:在保存照片前,特意将第1、2、3个像素分别设置为红、绿、蓝,保存的照片也显示像素值设置成功了,在真机上读取时,第1、2、3个像素值明显错误,在开发环境下读取正确。机器是华为mate20。 以下为核心代码: //第一步:照相; //第二步:将照片的第1个像素设置为红色,透明值230;第2个像素设置为绿色,透明值240;第3个像素设置为蓝色,透明值250;以示标记 //第三步:将照片保存到本地相册 this.ctx.takePhoto({ quality: 'high', success: (res) => { var context = wx.createCanvasContext('myCanvas'); var cvsInfoWidth = 400; //照片宽400 var cvsInfoHeight = 500; //照片高500 context.drawImage(res.tempImagePath, 0, 0, cvsInfoWidth, cvsInfoHeight); context.draw(true, res => { wx.canvasGetImageData({ canvasId: 'myCanvas', x:0, y:0, width: cvsInfoWidth, height: cvsInfoHeight, success(res) { const data1 = res.data; //获取图片像素值 data1[0] =255; //红色 data1[1] = 0; data1[2] = 0; data1[3] =230; //png照片的透明值 data1[4] = 0; data1[5] =255; //绿色 data1[6] = 0; data1[7] = 240; //png照片的透明值 data1[8] = 0; data1[9] = 0; data1[10] = 250; //蓝色 data1[11] = 255; //png照片的透明值 //重新设置canvas data wx.canvasPutImageData({ canvasId: 'myCanvas', x:0, y:0, width: Math.ceil(cvsInfoWidth), height: Math.ceil(cvsInfoHeight), data: data1, success(res) { } }); } }) }); //---------使用wx.canvasToTempFilePath将画布保存为图片--------- setTimeout(() => { wx.canvasToTempFilePath({ canvasId: 'myCanvas', fileType:'png', quality:1, success: function (res) { //将照片保存到本地相册 }, fail: function (res) {} }); }, 1000); } }); //在另外一个页面读取照片的像素值 wx.chooseImage({ count: 1, sizeType: ['original'], sourceType: ['album'], success(res) { var cvsInfoWidth = 400; var cvsInfoHeight = 500; var context = wx.createCanvasContext('myCanvas1'); context.drawImage(res.tempFilePaths[0], 0, 0, cvsInfoWidth, cvsInfoHeight, 0, 0, cvsInfoWidth, cvsInfoHeight); context.draw(true, res => { //获取canvas图片数据 wx.canvasGetImageData({ canvasId: 'myCanvas1', x:0, y:0, width: cvsInfoWidth, height: cvsInfoHeight, success(res) { console.log(res.data); } }) }); } })