threejs traverse an object onClick

问题

i want to add wireframe for an object onClick the button, so am using traverse to do it, it is working fine in the OBJMTLLoder, if a try it with the separate function like below onclick the button it cause

object is undefined

 function wireframe(object){
                 //alert('hhhhhh');

                object.traverse( function ( child ) {

                    if ( child instanceof THREE.Mesh )
                    {
                    //child.geometry.computeFaceNormals();
                    var  geometry = child.geometry;
                    //console.log(geometry);
                    //geometry.dynamic = true;
                    material = child.material;
                     mesh = new THREE.Mesh(geometry, material);
                        scene.add(mesh);

                    var useWireFrame = true;
                        if (useWireFrame) {
                            mesh.traverse(function (child) {
                                if (child instanceof THREE.Mesh) 
                                {
                                //child.material.wireframe = true;

                                var wfh = new THREE.WireframeHelper( mesh, 0xffffff );
                                wfh.material.wireframe = true;
                                wfh.material.linewidth = 2; // looks much better if your PC will support it
                                scene.add( wfh );                       

                                }
                            });
                        }

                    }
                    });



                }

can we traverse on the object onclick, is it possible ?? why am getting the error ??

回答1:

There are a couple of ways to add wireframe appearance to your object. One is to add a THREE.WireframeHelper to the scene. That is what you have done with the ladybug model and when the user presses the On button you add() the wireframe to the scene and when the user presses the Off button you remove() the wireframe object from the scene.

With the male model (the one that does not work) you wanted to look for the object material and go and change that.

You should load your model normally:

// this is asynchronous loading
// add a name to the object so you can search for it later.
var loader = new THREE.OBJMTLLoader();
loader.load( 'obj/male02/male02.obj', 'obj/male02/male02_dds.mtl',
    function ( object ) { object.name = 'name you want'; scene.add ( object ) } );

function wireframe() {
    var object = scene.getObjectByName ("name you want", true); // recursive search

    object.traverse ( function (child) {
        if (child instanceof THREE.Mesh)
            child.material.wireframe = true;
    }
}

来源：https://stackoverflow.com/questions/24385550/threejs-traverse-an-object-onclick

标签

javascript

three.js