javascript - 三.js |如何在 loader.load 之外使用对象的子属性

Question

我需要使用 dat.GUI() 动态更新对象的颜色属性。如果使用 Three.js 几何体创建对象，则很简单，但当我正在处理导入的对象(.obj 和 .mtl)时，我需要更新 loader.load 函数外部的属性。我怎样才能实现它？

编辑:

var mtlLoader = new THREE.MTLLoader();
mtlLoader.setPath( 'obj/Cube/' ); 
mtlLoader.load( 'cube.mtl', function( materials ) {
materials.preload();

    var objLoader = new THREE.OBJLoader();
    objLoader.setMaterials( materials );
    objLoader.setPath( 'obj/Cube/' );
    objLoader.load( 'cube.obj', function( object ) {
        object.traverse( function( child ) { 
            if ( child instanceof THREE.Mesh ) { 
                child.castShadow = true;
                child.material.color.set( 0x00ff00 );  // change color without dat.GUI
            } 
        } );
    companion = object;
    scene.add( object );
    });
});

gui = new dat.GUI();

parameters = 
{   
    color: "#ff0000",
    visible: true,
};

var objColor = gui.addColor( parameters, 'color' ).name('Color (Diffuse)').listen();
objColor.onChange(function(value) // onFinishChange
{   companion.material.color.setHex( value.replace("#", "0x") );   });

gui.open();
updateColor(companion);

<小时/>

function updateColor(obj)
{
    obj.material.color.setHex( parameters.color.replace("#", "0x") ); //I need to use the property here.
}

Answer 1

这个怎么样？ -

objColor.onChange(function(value) // onFinishChange
{
    companion.traverse( function( child ) { 
        if ( child instanceof THREE.Mesh ) { 
            child.material.color.setHex(value.replace("#", "0x"));
            child.material.needsUpdate = true;
        } 
    } );   
});