Anyway to add a switch to animate rotate lines through lil gui?

I made a spinning torus(funny) and added lil gui to add settings for camera positions, and the position of the torus, etc…

Screenshot 2024-05-01 2.27.19 PM

In basic, I have this code on the bottom in the animate section

//torus.rotation.x += 0.02;
//torus.rotation.y += 0.05;
//torus.rotation.z += 1.00;

would it be possible to enable or disable this using the gui instead of going into the code editor and disabling it everytime?
tahnkz!!
link to the torus

Yes, it is possible. You could add a checkbox to toggle on/off animation. Or a slider to change gradually the speed of rotation. Or a button to start/stop the rotation. Or a list box to select rotation options.

The next example is not in English, but you can click on its checkbox to see it in action:

var data = {
	...
	rotation: true
};
...
var gui = new lil.GUI();
    gui.add(data, 'rotation');
...
function animate(t)
{
	...
	if (data.rotation) scene.rotation.y += 0.1;
}

https://boytchev.github.io/CourseVAX/LecturesBG/04/E0420-gui-boolean.html

image

2 Likes

yooo! thank you so much!

1 Like