Question

我有一个threejs场景，我的相机是这样的：

var VIEW_ANGLE = 45, ASPECT = SCREEN_WIDTH  / SCREEN_HEIGHT , NEAR = 0.1, FAR = 8000;

camera = new THREE.PerspectiveCamera( VIEW_ANGLE, ASPECT, NEAR, FAR);

我创建了这样的材料：

var floorTexture = new THREE.ImageUtils.loadTexture( 'Images/floor62.jpg' );
floorTexture.wrapS = floorTexture.wrapT = THREE.RepeatWrapping; 
floorTexture.repeat.set( 3, 105 );
var floorMaterial = new THREE.MeshBasicMaterial( { map: floorTexture, side: THREE.DoubleSide } );
                    var floorGeometry = new THREE.PlaneGeometry(250, 10500 );

然后我创建了你在图片中看到的道路。它在z轴上很远，它由质量好的矩形制成。

问题是它非常靠近相机模糊（如图中所示）。这不正常，它在场景中体现了廉价的虚幻图形。

我该如何解决这个问题？

提前感谢！

enter image description here

Answer 1

关于anisotropic filtering的问题，有两个选择：完全修改算法或（最有可能）提高采样率。

修改Texture.minFilter以更改当纹理像素覆盖少于一个像素时如何采样纹理。修改Texture.magFilter来执行相反的操作：更改当纹理像素覆盖多个像素时采样纹理的方式。

要提高采样率，请修改Texture.anisotropy。

在两种情况下，如果您在最初加载场景后都在修改纹理，请记住之后再设置Texture.needsUpdate = true;。

Answer 2

使用floorTexture.generateMipmaps = false;。默认设置为true，在这种情况下，渲染器对远离相机的多边形使用较低分辨率的纹理。 Mipmaps通常是件好事。显卡内存较少。

Answer 3

可能您处于纹理分辨率低于所需的情况。

在这种情况下，你有2个可能性。来自three.js doc：

.magFilter

当纹理元素覆盖多个像素时如何对纹理进行采样。   默认值为THREE.LinearFilter，它采用四个最接近的纹素   并且在它们之间插入双线性。另一种选择是   THREE.NearestFilter，它使用最接近的纹素的值。

所以，你可以尝试将magFilter设置为Nearest，其中保持纹理的像素化

纹理模糊远离相机Three.js

3 个答案: