当使用CSS缩放属性时,如何说服浏览器使用“最近邻”,而不是“双线性”或任何其他更高级的缩放算法?

我的设置是一个包含画布的div,并且div通过JavaScript获取其缩放设置为< div style =“zoom:3200%”> …< / div>为了获得最近的邻居,我正在使用图像渲染:-webkit-optimization-contrast在我的CSS中。该应用可用here(‘z’放大,’shift-z’缩小),我的CSS是here

以下是Chrome在OSX上的预期效果(缩放设置为3200%):

但是Windows 7中的Chrome是一样的:

在这两种情况下,“vanilla”Chrome(版本15.x.x)开箱即用,没有实验标志打开。

如何说服Chrome在Windows上使用最近的邻居?对于这个问题,我如何说服所有的浏览器? Safari也不使用最近的邻居(到目前为止,该应用程序仅适用于基于WebKit的浏览器)

CSS图像渲染属性确实会影响Chrome / OSX,并给我所需的效果。但Chrome / Windows和Safari(5.1)/ OSX似乎完全忽视它。有些事告诉我,我只是不幸,但我想我会问。

使用缩放在div容器是如此简单,并在Chrome / OSX中精美地工作,如果我必须在内部调整我的画布,我也可以这样做。但是如果可能的话,更喜欢字面上一行代码解决方案!

更新:我发现使用图像渲染:optimizeSpeed有帮助。但是在Chrome / Windows中似乎很有挑战性。如果我设置太多的元素(我最初尝试过,我的容器和所有的画布),它不会生效。但是如果我把它应用到画布上,我会得到98%的方式。

现在我的问题是我第一次在放大时绘制,它的工作原理完美,所有其他随后的绘图动作都在模糊的同时发生,然后再次恢复到正确的最近邻居(我的应用程序首先绘制在一个画布,然后将绘图应用于真实画布)。 Chrome上坚持使用双线性的划痕画布有些奇怪。我想用一些挖掘我可以解决这个问题。

UPDATE2:似乎Chrome / Windows上的图像呈现效果不好,有点儿错误。现在我可以确认Chrome / Windows上不支持值optimizeSpeed和optimizeQuality。如果您为其设置图像呈现,Chrome将忽略该集。 Chrome / Windows确实会识别-webkit优化对比度,但是它并不一致地使用它。 Chrome将在几乎随机的双线性缩放算法和最近邻之间翻转。我无法一直让Chrome使用最近邻居。

我在Windows上尝试构建了Chromium 17,它的行为方式相同。

Firefox(8.0.1)看起来很有前途,尽管它似乎表现得非常好。最初我将Chrome定位为我的这个应用程序的“理想浏览器”,我可能只需切换到Firefox。

最后,似乎正确的支持图像呈现正在为Chrome开发,只是还没有。 WebKit本身声称完全支持所有的图像渲染值,但我猜测Chrome使用的WebKit的构建尚未更新到这个新的修复。