Question

我试图将纹理应用于模型，但仅在单个纹理的情况下有效。具有多个纹理的模型不会显示。

具有单一纹理的示例代码：

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

Answer 1

您不能为材料分配阵列。我认为您将其与cube texture混淆了。假设您的模型仅由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);
});

如何将多个纹理应用于GLTF模型？

1 个答案: