Question

我希望能够通过单击按钮从MeshBasicMaterial切换到obh的MeshLambertMaterial，并且似乎无法弄清楚如何做到这一点。有没有办法这样做，而无需拥有2个单独的.obj文件？我正在尝试切换.obj牛仔裤模型的材料。

下面的代码允许我在按钮点击时更改纹理，但不能更改材质。谢谢！

//start jean_1

    blue_denim_tex = new THREE.TextureLoader().load('stuff/blue_jean.jpg');

    black_denim_tex = new THREE.TextureLoader().load('stuff/black_jean.jpg');

    blue_mat = new THREE.MeshBasicMaterial({

        map: blue_denim_tex,


    }); 


    black_mat = new THREE.MeshLambertMaterial({

        map: black_denim_tex


    });


    objLoader1 = new THREE.OBJLoader();

    objLoader1.setPath( 'stuff/' );
    objLoader1.load( 'jean_1.obj', function ( object ) {
    object.traverse(function(child) {
    if (child instanceof THREE.Mesh){
        child.material = blue_mat;

    }
    });
    jean_1 = object;
    jean_1.position.y= -24;

    scene.add( jean_1 );

    }, onProgress, onError );


//buttons

info.innerHTML += '<input id=jean1 type="button" onclick="blue_mat.map =blue_denim_tex" value="color: blue"/>';
info.innerHTML += '<input id=jean2 type="button" onclick="blue_mat.map =black_denim_tex" value="color: black"/>';

Answer 1

您可以创建两个javascript函数，然后遍历该对象以分配新的材质：

function setBlueMaterial () {
    jean_1.traverse(function(child) {
        if (child instanceof THREE.Mesh){
            child.material = blue_mat;
        }
        jean_1.geometry.uvsNeedUpdate = true;
        jean_1.needsUpdate=true;
    });
}

function setBlackMaterial () {
        jean_1.traverse(function(child) {
            if (child instanceof THREE.Mesh){
                child.material = black_mat;
            }
            jean_1.geometry.uvsNeedUpdate = true;
            jean_1.needsUpdate=true;
        });
    }

Three.js通过按钮点击更改obj上的材料

1 个答案: