Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Textures look blurry when looking from a distance with Three.js

Tags:

three.js

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

Any idea what I could do to solve this? I create my textures like this:

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

enter image description here

If I select NearestFilter for both, the result looks rather ugly and too sharp:

enter image description here

like image 446
Nick Avatar asked Jan 01 '13 21:01

Nick


1 Answers

I would give anisotropic filtering a shot, but "no" bluriness is not really possible.

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

like image 186
Skurmedel Avatar answered Sep 19 '22 18:09

Skurmedel