画布线性缩小

时间:2016-03-23 18:07:09

标签: javascript html5 image canvas

我试图使用canvas进行图像缩小,以便稍后使用数据进行哈希比较。但是我注意到画布(或者至少我使用的简单代码)没有使用mipmap过滤器导致非常清晰的结果,并且使得针对另一个现有散列的测试失败(使用线性工作按照预期缩小gimp中的图像)。我用来缩减的代码是

axes.formatter.useoffset

这导致该图像(左)到预期的(右)

canvas vs gimp

如何让画布缩小线性?

1 个答案:

答案 0 :(得分:1)

new canvas draft指定了为画布设置重新采样/插值的方法。如果imageSmoothingEnabled = false(两种方法都用于放大和下采样),则当前方法始终为双线性或最近邻。新属性称为imageSmoothingQuality

  

背景。 imageSmoothingQuality [= value]

value can be" low"," medium"和" high" (例如像bi-cubic / Lanczos这样的东西)。但是,目前还没有浏览器在编写此文件时实现此功能,并且不强制要求使用每个值的实际算法。

替代方法是在需要使用多个步骤进行50%以上的更改时手动重新采样,或实施重新采样算法。

Here is an example 实现双立方质量水平的多个步骤(并避免初始CORS问题),以及 one showing the Lanczos algorithm (需要要满足的CORS要求)。

除此之外,您还可以应用sharpening convolution来弥补一些丢失的锐度。