Модель отображается черным цветом при использовании моделей Collada с ShaderMaterials в Three.js

Я попытался загрузить файл collada (экспортированный из Blender) в сцену three.js, а затем заменить материал на ShaderMaterial.

Поскольку в этом файле коллады есть только один объект, он расположен по адресу 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/

Как это исправить?


person Patrick    schedule 14.11.2012    source источник


Ответы (1)


Вы используете старый формат. Так должно быть

униформы["tDiffuse"].value = THREE.ImageUtils.loadTexture("color.png");

См. сообщение о миграции на странице three.js Wiki: https://github.com/mrdoob/three.js/wiki/Migration

изменения текстурного униформа: текстурные блоки теперь назначаются автоматически, объект текстуры переходит в свойство value вместо текстуры one { type: "t", value: 0, texture: map } => { type: "t", value: map }

person WestLangley    schedule 14.11.2012