Stop render function(requestanimationframe or setAnimationLoop)

Questions
, , , , , , ,
1

Hi
I want to rotate my model but because of some axes problems(I have 3d model and some other decal geometries in my scene). I decided to rotate the orbit and it worked better.
Now I need help in stopping orbitcontrol rotation.
I called this function in 3 place sometimes I send true and sometimes false.But When first time is true animate will be in unstoppable loop and just rotate unlimited even I try to stop it it did not work.

function rotateModel(model, rotationComplete) {

		const rotationSpeed = 0.006; // Adjust rotation speed as needed
		let isRotating = false; // Global state to track if rotation is ongoing
		let animationId = null;

		function animate(time) {

			if (isRotating) {
				console.log('rotatemodel animate');
				controls.current.autoRotate = true;
				controls.current.autoRotateSpeed = 1;
				controls.current.update();
	
			} else {
				controls.current.autoRotate = false;
			}
	
			renderer.current.render(scene.current, camera.current);
		}
	
		if (rotationComplete) {
			if (!isRotating) {
				isRotating = true; // Set the rotation state to true
				renderer.current.setAnimationLoop(animate); // Start the animation loop
			}
		} else {
			if (isRotating) {
				isRotating = false; // Set the rotation state to false to stop the animation
				renderer.current.setAnimationLoop(null); // Stop the animation loop
			}
		}

	}
2

It is possible to only render on demand, if this is what you are asking for?

Render on demand, no animation loop required

3

how to call it repeatedly.my camera should moving every second till I send false

4

When I try it, a simple true/false to controls.autoRotate is enough to start and stop automatic rotation. Most likely you have either overcomplicated the issue, or you have some additional requirements, that we do not know about.

2 Likes
5

your render is always running. But my main render just run when some thing will change.

6

That sounds like on demand rendering to me.

And maybe you are using R3F, I can’t be sure.

Here is an R3F example demonstrating frameloop="demand"

Note how the stats panel freezes when you turn off autoRotate

7

You can stop/resume the animation loop too:

function start( )
{
	controls.autoRotate = true;
	renderer.setAnimationLoop( animationLoop );
}

function stop( )
{
	controls.autoRotate = false;
	renderer.setAnimationLoop( null );
}
1 Like