在 Three.js 中使用带有 ShaderMaterials 的 Collada 模型时模型显示为黑色答案

【问题标题】：Model showing up black when using Collada Models with ShaderMaterials in Three.js在 Three.js 中使用带有 ShaderMaterials 的 Collada 模型时模型显示为黑色
【发布时间】：2023-03-26 12:32:01
【问题描述】：

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

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

材质设置如下：

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 });

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

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/

我该如何解决这个问题？

【问题讨论】：

标签： shader webgl three.js collada

【解决方案1】：

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

制服[“tDiffuse”].value = THREE.ImageUtils.loadTexture(“color.png”);

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

纹理统一更改：纹理单元现在自动分配，纹理对象转到值属性而不是纹理一 { type: "t", value: 0, texture: map } => { type: "t", value:地图}

【讨论】：

【解决方案2】：

你需要去：编辑对象，选择（按a）然后去Mesh--> Normals-->Reset Vectors。

【讨论】：

您的答案可以通过添加有关建议的答案如何解决问题以及它如何帮助 OP 的更多信息来改进。