OBJLoader и MTLLoader не отображают png / текстуру в ThreeJS

Я импортировал 3D-модель, содержащую .obj .mtl и кучу jpeg и pngs.

пытается загрузить модель с помощью / images, как это
пытается загрузить модель с помощью / images, как это

Но я получаю только черную модель, такую ​​как его
мой рендеринг холста

Интересно, что я упустил, следуя инструкциям по использованию двух загрузчиков.

вот мой код.

//loader 
var MTTLoader = new THREE.MTLLoader();
MTTLoader.setPath( '/assets/HotAirBalloonIridesium/' );
MTTLoader.load('Air_Balloon.mtl',(materials) => {
    console.log(materials);
    materials.preload()
    var objLoader = new THREE.OBJLoader();
    objLoader.load('/assets/HotAirBalloonIridesium/Air_Balloon.obj', (object) => {
        console.log(materials)
        objLoader.setMaterials(materials)
        scene.add(object);
    })
})

Интересно, что мне не хватает, так как моя папка с активами содержит все файлы модели


javascript three.js objloader
person Nawar Tamawi    schedule 23.08.2017    source источник

Ответы (3)


arrow_upward
0
arrow_downward

попробуйте загрузить obj с помощью

    var loader = new THREE.OBJLoader( manager );
            loader.load( 's_v1.obj', function ( object ) {

                object.traverse( function ( child ) {

                    if ( child instanceof THREE.Mesh ) 
                    {

                        // child.material.map = texture2;
                        // child.material.specularMap=texture;
                        // child.material.map=texture;

                    }
                } );

                // object.position.x = - 60;
 //                object.rotation.x = 0; //20* Math.PI / 180;
 //                object.rotation.z = 0;//20* Math.PI / 180;
                object.scale.x = 80;
                object.scale.y = 80;
                object.scale.z = 80;
                obj = object
                scene.add( obj );
                animate(obj);

            } );
person nOmi    schedule 24.08.2017
comment
Не могу решить проблему. Я загрузил тот же файл obj и mtl в онлайн-программу просмотра, чтобы дважды проверить, что проблема связана с тем, как я его загружаю. объект был отлично загружен материалом. Тем не менее, спасибо за вашу помощь. - person Nawar Tamawi; 24.08.2017

arrow_upward
0
arrow_downward

хорошо, быстрое обновление, с загрузчиком все в порядке, но я использовал неправильное освещение, так как требовался материал Фонга

var hemiLight = новый THREE.HemisphereLight (0xffffff, 0xffffff, 0.50);

var dirLight = новый THREE.DirectionalLight (0xffffff, 0,50);

быть очевидным.

person Nawar Tamawi    schedule 01.09.2017

arrow_upward
0
arrow_downward

Вы должны вызвать setMaterials перед загрузкой obj.

//loader 
var MTTLoader = new THREE.MTLLoader();
MTTLoader.setPath( '/assets/HotAirBalloonIridesium/' );
MTTLoader.load('Air_Balloon.mtl',(materials) => {
    console.log(materials);
    materials.preload()
    var objLoader = new THREE.OBJLoader();
    objLoader.setMaterials(materials); // "setMaterials" must before "load"
    objLoader.load('/assets/HotAirBalloonIridesium/Air_Balloon.obj', (object) => {
        console.log(materials)
        scene.add(object);
    })
})
person rainstop3    schedule 21.12.2019