get back to normal after the traverse in threejs - three.js

Question

in threejs am working around with the traverse method to apply the WireframeHelper for the models that is loaded using OBJMTLLoder, for this kind of models we must use traverse to apply the Wireframe for child of the Object, so here i can apply the wireframes and so on using traverse but after the traverse i can't get back to my normal object meaning that i can't remove the wireframes with the traversed mesh, the mesh is added with the scene with scene.add( wfh ); where wfh is WireframeHelper , but if i use scene.remove( wfh ); to remove the meshed WireframeHelper it doesn't work
i need to know that after the traverse we can get back to normal ?? in most cases am using traverse to make changes on my model:
Here is the code:
scene.traverse ( function (child)
{
if (child instanceof THREE.Mesh)
{
wfh = new THREE.WireframeHelper( child, 0xffffff );
scene.add( wfh );
}
});
updated code:
globalObject.traverse ( function (child) {
if (child instanceof THREE.Mesh)
{
wfh = new THREE.WireframeHelper( child,whfcolor );
wfh.name = "wireframe_helper";
wfh.material.opacity = 0.2;
wfh.material.transparent = true;
globalObject.add( wfh );
}
});
here globalObject is global variable assigned to Object now i can see the wireframe_helper on the child of the Object and can remove the wireframe by following code
globalObject.traverse( function ( child ) {
if (child instanceof THREE.Object3D)
{
//alert(child.name);
if ( child.name && child.name === "wireframe_helper" && child.material ) {
//alert('hi');male-02-1noCullingID_male-02-1noCulling.JP
globalObject.remove( child );
//child.material.wireframe = true;
}
}
});
after removed the wireframe still wireframe is remains some part of the Object any clue on this ?? and am getting
TypeError: this.children[i] is undefined
this.children[ i ].traverse( callback );
on line three.js 7885

Answer 1

WireframeHelper() creates an object that is added to the scene-graph. When you are using the helper inside a traverse() operation you are adding many objects to the scene. So if you want to remove them, you have to save them off to a variable (array in this case since you have many of them). So something like this should work:
First name the helper inside the first traverse():
wfh = new ...
wfh.name = "wireframe_helper";
scene.add( wfh );
then you should be able to do:
scene.traverse ( function (child)
{
if (child.name === "wireframe_helper")
{
scene.remove( child );
}
}
The code above would probably crash when trying to traverse a child that has been removed.
Here is updated code:
to_remove = [];
scene.traverse ( function (child)
{
if (child.name === "wireframe_helper")
to_remove.push( child );
}
for (var i = 0; i < to_remove.length(); i++)
scene.remove( to_remove[i] );