是否像opencv那样在three.js中有Inter_area纹理minFilter？

Question

我有一个three.js画布，上面上传了一个2730x4096分辨率的图像。我提供了从画布下载图像的不同分辨率的选项。下载较低分辨率的图像（例如960x1440图像）时，会得到非常模糊的图像，边缘呈锯齿状。

我尝试通过将各向异性设置为max（在我的情况下为16）来提高清晰度，并且还尝试使用map.minFilter = THREE.LinearFilter，它还可以使图像进一步锐化，但是边缘仍然呈锯齿状。

我试图通过FXAA抗锯齿作曲家来运行它，但是抗锯齿不是很好。可能是我没有提供正确的参数。 来自渲染器的所有反锯齿一直处于活动状态（renderer.antialias = true）

当我尝试在opencv中执行相同操作时，我使用了cv2.INTER_AREA插值来缩小2730x4096图像的尺寸，这使我获得了非常清晰的图像，绝对没有锯齿边缘。

所以我在考虑是否为minFilter而不是THREE.LinearFilter实现INTER_AREA插值可能会产生更好的结果。在three.js中已经存在我没有利用的东西，或者如果我必须使用这种新的插值方法，该如何处理？

插图： PFA有两个文件-一个文件是使用three.js canvas直接以960x1440分辨率下载的（底部一个），另一个是使用opencv从2730x4096缩小到960x1440的图像（顶部一个）。在经过缩减的opencv图像中，与three.js图像相比，细节更清晰，边缘更清晰。我开始相信这是因为在opencv中用于缩小尺寸的INTER_AREA插值。可以在three.js中复制吗？

原始高分辨率图像可以从here下载

Answer 1

不知道您的设置是什么，但是通过启用THREE.LinearFilter，您将不再使用Mipmapping，它在对大型纹理进行下采样方面非常有效。默认值为LinearMipMapLinearFilter，但您还有其他选择，如texture constants docs page所述。我发现使用默认设置以外的任何设置都会使您的纹理松脆。

此外，请确保在需要时启用renderer.antialias = true;的抗锯齿功能。考虑到您问题中代码的范围有限，因此不确定您是否已经在执行此步骤。