我只是尝试使用以下代码将Normal map Ninja demo应用于场景中的多维数据集 – 使用dev分支中的新的最新Three.js版本:
// common material parameters
var ambient = 0x050505,diffuse = 0x331100,specular = 0xffffff,shininess = 10,scale = 23;
// normal map shader
var shader = THREE.ShaderUtils.lib[ "normal" ];
var uniforms = THREE.UniformsUtils.clone( shader.uniforms );
uniforms[ "enableAO" ].value = true;
uniforms[ "enableDiffuse" ].value = false;
uniforms[ "enableSpecular" ].value = false;
uniforms[ "enableReflection" ].value = true;
uniforms[ "tNormal" ].texture = THREE.ImageUtils.loadTexture( "normal.jpg" );
uniforms[ "tAO" ].texture = THREE.ImageUtils.loadTexture( "ao.jpg" );
uniforms[ "tDisplacement" ].texture = THREE.ImageUtils.loadTexture( "displacement.jpg" );
uniforms[ "uDisplacementBias" ].value = - 0.428408 * scale;
uniforms[ "uDisplacementScale" ].value = 2.436143 * scale;
uniforms[ "uDiffuseColor" ].value.setHex( diffuse );
uniforms[ "uSpecularColor" ].value.setHex( specular );
uniforms[ "uAmbientColor" ].value.setHex( ambient );
uniforms[ "uShininess" ].value = shininess;
uniforms[ "tCube" ].texture = reflectionCube;
uniforms[ "uReflectivity" ].value = 0.1;
uniforms[ "uDiffuseColor" ].value.convertGammaToLinear();
uniforms[ "uSpecularColor" ].value.convertGammaToLinear();
uniforms[ "uAmbientColor" ].value.convertGammaToLinear();
var parameters = { fragmentShader: shader.fragmentShader,vertexShader: shader.vertexShader,uniforms: uniforms,lights: true,fog: false };
var displacementMaterial = new THREE.ShaderMaterial( parameters );
/*
var diamond = new THREE.Diamond({
material: bumpmapMaterial
});
*/
var diamond = new THREE.Mesh(
new THREE.CubeGeometry(50,50,50),displacementMaterial
);
但是,我在Chrome中收到以下WebGL错误:
GL_INVALID_OPERATION : glDrawXXX: attempt to access out of range vertices
在Firefox中,我没有收到这样的错误,但是立方体也不会出现.
使用标准的有色MeshLambertMaterial,一切正常.因此,需要与ShaderMaterial发生冲突.如果我使用MASTER分支的最新Three.js版本,它不会改善这种情况 – 发生同样的错误.
知道为什么会出现这种情况以及我需要改变什么以使其正常工作?
最佳答案
尝试添加这个?
原文链接:https://www.f2er.com/js/429602.htmlgeometry.computeTangents();