Trois JS: Le déplacement de vertex via des textures est-il limité à 256 valeurs?

Question

Je suis rendu la texture suivante à un WebGLRenderTarget en ThreeJS utilisant Ashima's GLSL noise:

Je suis ensuite lire les canaux RVB de la texture pour déplacer les sommets de plusieurs mailles dans les axes XYZ avec le code GLSL suivant :

vec4 fluctuation = texture2D(fluxTexture, uv); 
curPos.y += (fluctuation.r - 0.5) * 40.0; 
curPos.x += (fluctuation.g - 0.5) * 20.0; 
curPos.z += (fluctuation.b - 0.5) * 20.0; 

Cependant, étant donné que le mouvement est très subtil, j'ai remarqué que les sommets sauter quelques pixels pour chaque étape lorsque les valeurs RVB changent. J'attribue cet artefact à la limitation de chaque couleur à 256 valeurs chacune. Y at-il un moyen de changer la profondeur de bit de la texture à 16 ou 32 bits afin que je puisse obtenir plus de précision sur les canaux RVB?

Answer 1

Vous êtes intéressé par la propriété type d'une cible de rendu:

https://threejs.org/docs/?q=webgl#Reference/Constants/Textures

Vous pouvez essayer THREE.FloatType.

// Test for iOS devices, because they don't support THREE.FloatType 
var dataType = (/(iPad|iPhone|iPod)/g.test(navigator.userAgent)) ? THREE.HalfFloatType : THREE.FloatType; 

this.renderTarget = new THREE.WebGLRenderTarget(50, 50, { 
    format: THREE.RGBAFormat, 
    type: dataType, 
});