Can anyone tell me why I can’t update the theta length in R3F ?
Here is the code
function Circle({...props}:any) {
const circleRef = useRef<any>(null);
const elapsedTimeRef = useRef<number>(0);
const animationDuration = 2; // Animation duration in seconds
useFrame((state, delta) => {
if (circleRef.current) {
elapsedTimeRef.current += delta;
// Calculate the thetaLength based on the elapsed time and animation duration
const thetaLength = (elapsedTimeRef.current / animationDuration) * 2 * Math.PI;
// Update the geometry with the new thetaLength
// circleRef.current.geometry.parameters.thetaLength = thetaLength;
// console.log(circleRef.current.geometry.parameters)
// circleRef.current.geometry.parameters.verticesNeedUpdate = true;
// Reset the elapsed time and animation after the duration is reached
if (elapsedTimeRef.current >= animationDuration) {
elapsedTimeRef.current = 0;
}
}
});
return (
<>
<mesh
{...props}
ref={circleRef}
>
<circleGeometry args={[1.5,100,0,0]}/>
<meshStandardMaterial
color={0xf5e347}
toneMapped={true}
/>
</mesh>
</>
)
}
I already tried verticesneedUpdate but it doesn’t change anything or whatsoever.
I’m trying to achieve this in animation but it couldn’t work the thetaLength.
https://threejs.org/docs/index.html?q=Circl#api/en/geometries/CircleGeometry