Now I wonder, how could I tell datGUI, so when I un-tick or tick the fog option, it would add or remove those 4 code lines from the init() function? Or maybe there is another way to disable the fog?
My checkbox code looks like this:
let sb = gui.add( controlBoxParams, 'fog_on').name('Fog animation On/Off');
sb.listen();
sb.onChange( function ( value ) {
if (value == true){
//add fog code to init function
}
else {
//remove fog from init function
}
});
I just don’t quite know how I can tell the program to add or remove that code in specific function. Any ideas are welcome
I like the idea of FogExp2, I tried to implement it now, but it doesn’t quite work. How should I declare density parameter so that I could set it in the datGUI? My fog function looks like this:
const fogcolor = 0xffffff;
const density = 0.015;
scene.fog = new THREE.FogExp2(fogcolor, density);
Default value of fog_on is true, there is fog in the scene. However, if I turn it off, nothing changes:
let sb = gui.add( controlBoxParams, 'fog_on').name("Fog animation ON/OFF");
sb.listen();
sb.onChange( function ( value ) {
if (value == true){
density = 0.015;
console.log("works");
//add fog code to init function
}
else {
density = 0;
//remove fog from init function
}
});
I think I’m doing something wrong with the variable density since it doesn’t pass the value as it should.