Search code examples
javascriptthree.jsshow-hidescene

How to hide and show an object on scene in three.js

I have an object which is composed of spheres on my scene. And I have a hide and show button.
The flow of my program is like that. For example, when I select one of the spheres (I used raycasting for select a sphere) then click the hide button, this sphere will be hidden. And after then click the show button it will be shown. But I don't know how can I do it.
I used three.js for creating my scene.
And I don't find any example for my question. How can I do it?
Thanks for your help.

Solution

  • simply use the object traverse method to hide the mesh in three.js. In my code hide the object based on its name

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

    Here is the working sample for Object show/hide option http://jsfiddle.net/ddbTy/287/

    I think it should be helpful,..