HarmonyOS 鸿蒙Next 使用OffscreenCanvas绘制图片转成ArrayBuffer后获取到的字节大小与原图相比差距过大

发布于 1周前 作者 yuanlaile 最后一次编辑是 5天前 来自 鸿蒙OS

HarmonyOS 鸿蒙Next 使用OffscreenCanvas绘制图片转成ArrayBuffer后获取到的字节大小与原图相比差距过大
在上传图片时,使用OffscreenCanvas绘制图片转成ArrayBuffer,获取到的字节数与通过stat获取到的差异过大,比原图的字节数大了近3倍,这个是什么原因呀?

async function imageAddWatermark(imageInfo: PicListItem, waterConfig: UploadImgParams, iSize: number):Promise<image.PixelMap> {

  const imgW = px2vp(imageInfo.width)

  const imgH = px2vp(imageInfo.height)

  // 这个回调的pixelMap就是当前图片的pixelMap

  let offScreenCanvas = new OffscreenCanvas(imgW, imgH)

  console.log('finally iSize 原图字节大小 ==', iSize)

  let OffScreenContext = offScreenCanvas.getContext("2d")

  // OffScreenContext.imageSmoothingEnabled = false;

  OffScreenContext.drawImage(imageInfo.pix, 0, 0)

  // 获取新的 PixelMap

  let newPixelMap = OffScreenContext.getPixelMap(0, 0, offScreenCanvas.width, offScreenCanvas.height)

  let imgArrayBuffer = await imagePacker(newPixelMap)

  const sPixSize = imgArrayBuffer.byteLength

  console.log('finally sPixSize canvas画出来的图片字节大小 ==', sPixSize)

  return newPixelMap

}

更多关于HarmonyOS 鸿蒙Next 使用OffscreenCanvas绘制图片转成ArrayBuffer后获取到的字节大小与原图相比差距过大的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html

2 回复
OffscreenCanvas默认单位是vp,而pixmap宽高是px,需要使用 px2vp转一下

更多关于HarmonyOS 鸿蒙Next 使用OffscreenCanvas绘制图片转成ArrayBuffer后获取到的字节大小与原图相比差距过大的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


HarmonyOS 鸿蒙Next中,使用OffscreenCanvas绘制图片并转成ArrayBuffer时,获取到的字节大小与原图相比差距过大,这通常是由以下原因造成:

  1. 压缩算法:在图片绘制到OffscreenCanvas再转成ArrayBuffer的过程中,系统可能应用了某种压缩算法以减少内存占用或提高处理速度,这会导致字节大小发生变化。

  2. 像素格式转换:原图可能采用了较高质量的像素格式(如RGBA32),而转换成ArrayBuffer时可能使用了较低质量的像素格式(如RGB565),这种转换也会导致字节大小的变化。

  3. 编码方式:原始图片可能是JPEG、PNG等常见格式,它们具有不同的压缩率和编码方式。转换成ArrayBuffer时,若采用原始像素数据而不进行再压缩,虽然保持了无损,但可能因格式差异导致字节大小不同。

  4. 图像缩放:在绘制过程中,如果图片被缩放,也会影响最终ArrayBuffer的字节大小。

为确保获取的ArrayBuffer字节大小符合预期,应检查OffscreenCanvas的绘制参数、像素格式及转换过程中是否应用了不必要的压缩或格式转换。如果问题依旧没法解决请联系官网客服,官网地址是:https://www.itying.com/category-93-b0.html

回到顶部