Hello Members, I want hide and show object on button. Object is showing on click button but not hide on button, see following code.
It could be simplified to:
object.visible = false;
document.getElementById("hideShow").addEventListener("click", function(){
object.visible = !object.visible;
});
7 Likes
Here’s my boilerplate solution:
import { GUI } from 'https://threejs.org/examples/jsm/libs/dat.gui.module.js';
// ...
const effectController = {
showMyGeometry: false,
};
// ...
init();
// ...
function init(){
// init 3dm loader
const loader = new Rhino3dmLoader();
loader.setLibraryPath( '/jsm/libs/rhino3dm/' );
// load geometry file
loader.load('./models/myModel.3dm',
function ( object ) {
object.traverse (
function( child ) {
if ( child instanceof THREE.Mesh ) {
child.material = myMeshMaterial;
}
}
);
myGeometry = object;
myGeometry.visible = false;
scene.add( myGeometry );
} );
// init GUI
initGUI();
// ...
}
// ...
function initGUI() {
gui = new GUI( { width: 300 } );
gui.add( effectController, 'showMyGeometry' ).onChange( function ( value ) {
myGeometry.visible = value;
} );
}