画布图像调整大小使文件变大

我正在实现图像上传，但在此之前，我想根据限制（例如，最大宽度，最大高度，最大面积）进行一些调整大小。问题不在于调整图像大小，而在于文件大小。画布图像调整大小使文件变大

我已经放弃了质量，结果没有明显的差异：帆布，Pica,Hermite，所以我决定去离线画布。

文件大小是一个更大的问题，例如：如果我有PNG图像，那就是345x518（54.2kB），我希望它适合区域512x512，将其调整为341x512 jpeg（相同宽高比）后，文件大小变为171.7kB。

大小功能：

function _canvasImageGet(original, dims) { 
    var canvas = document.createElement("canvas"); 
    canvas.width = dims.w; 
    canvas.height = dims.h; 
    canvas.getContext("2d").drawImage(original, 0, 0, canvas.width, canvas.height); 

    return canvas; 
}

有什么办法，我怎么能得到调整后小于或相同的文件大小？它不一定要使用Canvas，但我会感激，如果调整大小将在客户端。感谢所有的支持者。

来源

2017-08-27 marsielko

将取决于图像及其内容。将图像转换为JPEG格式时，可以将质量设置为第二个参数。例如'canvas.toDataURL（“image/jpeg”，质量）'质量在0 <质量<= 1范围内，其中低值质量较低。这可以对文件大小产生很大的影响。 – Blindman67

我用过的Canvas和其他库没有使用压缩，因此在调整大小后，输出文件自然比之前大。我已经找到了我需要的东西。 image-compressor确实调整大小和压缩，并在客户端完成所有操作。还有另一个库JIC，但它不能调整大小。

来源

2017-08-30 08:44:32 marsielko

画布图像调整大小使文件变大

回答

相关问题