翻译自-TojiCode-Anisotropic Filtering in WebGL
首先展示一个简单的示例.

这个示例虽然简陋但是很好地展示了效果。如果您对这个概念不熟悉,这里简单解释一下。各向异性过滤(Anisotropic Filtering)是标准mip-mapping技术的一个扩展,用于优化在非正交视角下材质的显示效果。如上例中演示的地板和天花板。通过标准的三线形过滤(gl.LINEAR_MIPMAP_LINEAR)离摄像机越远的部分就变得越来越模糊。

通过使用各向异性过滤,我们更改了在这些特殊场景下mipmaps的采样方式(译者:采样窗口有可能为非标准的矩形甚至平行四边形等等),从而使图像更加清晰。

开启这个功能将带来一些性能损失,当您开启它的时候,您可以权衡设置采样数。这是在PC游戏中非常常见的一个设置,所以现在我们能在web上使用它是非常好的。
实现
在支持它的浏览器中使用它非常简单,与其它WebGL扩展一样,我们首先查询它看是否可用:
var ext = gl.getExtension(“MOZ_EXT_texture_filter_anisotropic”);
显然,如果使用Chrome,您应该使用WEBKIT_而不是MOZ_的前缀。如果它返回null,则说明浏览器不支持此功能,我们将很不幸地继续在模糊的墙壁中间生活(译者:好吧,这句是个笑话~~)。反之,如果支持,它将返回一个这个扩展的枚举对象。
然后我们将像设置纹理双线/三线性过滤或者纹理Wrap模式一样,在每个纹理中设置它,需要用到新的扩展标识符:
gl.texParameterf(gl.TEXTURE_2D,ext.TEXTURE_MAX_ANISOTROPY_EXT,4);
这里,我们对纹理对象启用了4x过滤(演示中使用的值)。将其设置为1将会关闭此功能,并且您的显卡决定了这个数值的上限。您可以这样查询显卡的支持:
var max_anisotropy = gl.getParameter(ext.MAX_TEXTURE_MAX_ANISOTROPY_EXT);
所以,就像我说的,这个是个简单的API,却可以大幅度提高渲染质量。
参考: