Textures look blurry when viewed from a distance using Three.js

In my game that uses Three.js, my textures look blurry when I leave them. Due to the nature of my 16-bit retro style, I should not have anything blurry.

Any idea what I can do to solve this? I create my textures as follows:

var texture = new THREE.Texture( image, new THREE.UVMapping(), THREE.RepeatWrapping, THREE.RepeatWrapping, THREE.NearestFilter, THREE.LinearMipMapLinearFilter ); 

enter image description here

If I choose NearestFilter for both, the result looks pretty ugly and too sharp:

enter image description here

+6
source share
2 answers

I used NearestMipMapLinearFilter instead of LinearMipMapLinearFilter and the result looks acceptable:

enter image description here

+4
source

I would give anisotropic filtering of the shot, but a โ€œnoโ€ blur is really not possible.

Here is an example: http://mrdoob.github.com/three.js/examples/webgl_materials_texture_anisotropy.html

+3
source

All Articles