Как применить несколько текстур к моделям GLTF? - PullRequest
Новая
       41

Как применить несколько текстур к моделям GLTF?

0 голосов
/ 04 июня 2019

Я пытался применить текстуру к модели, но она работает только в случае одной текстуры.С несколькими текстурами модель не отображается.

Пример кода с одной текстурой: 

loader = new THREE.GLTFLoader().setPath('models3/');
const textureLoader = new THREE.TextureLoader();
loader.load('01-Fundament-002.gltf', function (gltf) {
    var model = gltf.scene;
    model.traverse ( ( o ) => {
        if ( o.isMesh ) {
            o.material.map = textureLoader.load('models3/Beton OsnovaVRay-DiffuseShadowMap-Edit.png');
        }
    } );
    scene.add(model);
});

Пример кода с несколькими текстурами: 

loader = new THREE.GLTFLoader().setPath('models3/');
const textureLoader = new THREE.TextureLoader();
loader.load('01-Fundament-002.gltf', function (gltf) {
    var model = gltf.scene;
    model.traverse ( ( o ) => {
        if ( o.isMesh ) {
            const materials = [
                    new THREE.MeshBasicMaterial({map: textureLoader.load('models3/1.png')}),
                    new THREE.MeshBasicMaterial({map: textureLoader.load('models3/2.png')}),
                    new THREE.MeshBasicMaterial({map: textureLoader.load('models3/3.png')}),
                    new THREE.MeshBasicMaterial({map: textureLoader.load('models3/4.png')}),
                ];

            o.material = materials;
        }
    } );
    scene.add(model);
});

1 Ответ

0 голосов
/ 04 июня 2019

Вы не можете присвоить массив материалу.Я думаю, что вы путаете это с текстурой куба .Это должно работать, если ваша модель состоит только из 4 мешей. 

var i = 1;
loader = new THREE.GLTFLoader().setPath('models3/');
const textureLoader = new THREE.TextureLoader();
loader.load('01-Fundament-002.gltf', function (gltf) {
    var model = gltf.scene;
    model.traverse ( ( o ) => {
        if ( o.isMesh ) {
            o.material = new THREE.MeshBasicMaterial({map: textureLoader.load(`models3/${i++}.png`)});
        }
    });
    scene.add(model);
});
...