在三.js中使用带有着色器材质的 Collada 模型时，模型显示为黑色

Question

我尝试将一个 collada 文件（从 Blender 导出）加载到三.js场景中，然后用 ShaderMaterial 替换材质。

由于这个 collada 文件中只有一个对象，它位于 collada.scene.children[0]，所以我尝试将材质属性更改为新创建的属性。我可以轻松地用线框甚至带纹理的标准PhongMaterial替换材质，但是一旦我添加了着色器材质，模型就会以黑色显示，没有任何照明或纹理。

材料设置如下：

materials[0] = new THREE.MeshBasicMaterial( { color: 0xff0000, wireframe: true } );
var shader = THREE.ShaderUtils.lib[ "normal" ];
var uniforms = THREE.UniformsUtils.clone( shader.uniforms );
uniforms[ "tDiffuse" ].texture = THREE.ImageUtils.loadTexture( "color.png" );
uniforms[ "tNormal" ].texture = THREE.ImageUtils.loadTexture( "normal.png" );
uniforms[ "tSpecular" ].texture = THREE.ImageUtils.loadTexture( "spec.png" );
uniforms[ "enableDiffuse" ].value = true;
uniforms[ "enableSpecular" ].value = true;
materials[1] = new THREE.ShaderMaterial( {
  uniforms: uniforms,
  vertexShader: shader.vertexShader,
  fragmentShader: shader.fragmentShader,
  lights: true
});
var basicTexture = THREE.ImageUtils.loadTexture( "color.png ")
materials[2] = new THREE.MeshPhongMaterial( { map: basicTexture });

在模型加载时，我将着色器材质添加到模型，然后再将其添加到场景中，以便所有必要的属性都可用：

loader.load('model.dae', function(collada) {
  model = collada.scene;
  model.scale.x = model.scale.y = model.scale.z = 50;
  model.rotation.y = 180;
  model.updateMatrix();
  model.children[0].material = materials[1];
  model.children[0].geometry.computeTangents();
  scene.add(model);
});

完整的源代码可在此处获得：http://rainbowrangers.de/normalmap/

我该如何解决这个问题？

Answer 1

您使用的是旧格式。它应该是

制服[ "tDiffuse" ].value = THREE.ImageUtils.loadTexture（ "color.png" ）;

请参阅三.js维基的迁移帖子：https://github.com/mrdoob/three.js/wiki/Migration

纹理

统一更改：纹理单位现在自动分配，纹理对象转到值属性而不是纹理 1 { 类型："t"，值：0，纹理：映射 } => { 类型："t"，值：映射 }

Answer 2

您需要转到：编辑对象，选择（按 a），然后转到网格 ->法线 ->重置矢量。