canvas toDataURL方法中的quality参数对PNG图片不生效

在使用 canvas 生成图片时,使用到了 toDataURL 的方法。

1
canvas.toDataURL("image/png",quality);

对于参数 0 <= quality <= 1quality 越小,压缩质量越差,生成的图片尺寸越小,图像越模糊。
对于 jpg 格式的图片,这个参数是生效的。但对于 png 格式的图片,无论 quality 是任何值,最终生成的图片都一样的体积。

这是因为 png 格式输入无损图片格式,不管怎么设置,quality 永远等于 1。

这就是 quality 参数对 png 格式图片不生效的原因。

只有在指定图片格式为 image/jpegimage/webp 的情况下,可以从 0 到 1 的区间内选择图片的质量。也就是说 quality 参数只对 jpgwebp 图片有效。

PNG 图片如何压缩?

一般而言,压缩 PNG 图片,需要对图片进行重新采样,即把相似的颜色进行合并,这种技术被称作“量化(quantization)”。在线工具可以使用 图片压缩优化工具

参考资料:Canvas toDataURL文档


:D 一言句子获取中...