three.js .mtl 속성이 사용자 정의 셰이더에 설정되어 있지 않음

Question

렌더링을 위해 OBJ/MTL 모델을로드하는 사용자 정의 three.js 응용 프로그램을 만듭니다. 로드 된 모델에 맞춤 셰이더를 적용하고 싶지만 RawShaderMaterial에 수동으로 전달하는 색상 & 반사 유니폼은 업데이트되지 않습니다. 또는 오히려 그들은 모두 동일한 가치로 채워집니다. 따라서 내 모델을 같은 색으로 렌더링합니다.

그는 몇 가지 예제 코드입니다. 쉬운 해결책 또는 더 나은 접근 방법이 있다면, 나는 매우 알고 싶어합니다.

var mtlLoader = new THREE.MTLLoader(); 
mtlLoader.setPath(path); 
mtlLoader.load(mtlName, function(materials) { 
var objLoader = new THREE.OBJLoader(); 
materials.preload(); 


objLoader.setMaterials(materials); 


objLoader.setPath(path); 
objLoader.load(objName, function(object) { 
    if (shader) { 
     object.traverse(function (child) { 
      if (child instanceof THREE.Mesh) { 
       var customShader = shader; 
       var color = child.material["color"]; 
       customShader.uniforms["color"] = {type: 'v3', value: color}; 
       customShader.uniforms["specular"] = {type: 'v3', value: child.material["specular"]}; 

       child.material = customShader; 
      } 
     }); 
    } 
} 

버텍스 쉐이더 : 정밀도 부동 mediump; 정밀도 mediump int;

uniform mat4 modelViewMatrix; 
    uniform mat4 projectionMatrix; 

    attribute vec3 position; 
    attribute vec3 normal; 
    attribute vec2 uv; 

    varying vec3 Normal; 
    varying vec2 UV; 

    void main() { 
     Normal = normal; 
     UV = uv; 
     gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0); 
    } 

조각 쉐이더 : 정밀 mediump float; 정밀도 mediump int;

uniform vec3 color; 
    uniform vec3 specular; 

    varying vec3 Normal; 
    varying vec2 UV; 

    void main() { 
     gl_FragColor = vec4(color, 1.0); 
    } 

Answer 1

내 문제가 발견되었습니다.

ShaderMaterial을 올바르게 복제하지 못했기 때문입니다.

object.traverse(function (child) { 
     if (child instanceof THREE.Mesh) { 
      var customShader = shader.clone(); 
      var color = child.material["color"]; 
      customShader.uniforms["color"] = {type: 'v3', value: color}; 
      customShader.uniforms["specular"] = {type: 'v3', value: child.material["specular"]}; 

      child.material = customShader; 
     } 
    });