Open
Description
replace the code below in the example
I added a test that toggles the Slopes every 3s and you can see that the camera still detects slopes and zooms in even though the slopes have been removed from the scene
the problem is that the useFollowCam relies on component render, so if you add or remove elements that aren't at the level ecctrl was invoked then it won't rerender ecctrl and useFollowCam wouldn't update the intersectObjects array
import { RigidBody } from "@react-three/rapier";
import { useGLTF, Text } from "@react-three/drei";
import { useEffect, useState } from "react";
import * as THREE from "three";
export default function Slopes() {
// Load models
const slopes = useGLTF("./slopes.glb");
const [visible, setVisible] = useState(true);
useEffect(() => {
// Receive Shadows
slopes.scene.traverse((child) => {
if (
child instanceof THREE.Mesh &&
child.material instanceof THREE.MeshStandardMaterial
) {
child.receiveShadow = true;
}
});
}, []);
useEffect(() => {
const a = setInterval(() => {
setVisible(!visible);
}, 3000);
return () => {
clearInterval(a);
};
}, [visible]);
if (!visible) {
return null;
}
return (
<group position={[-10, -1, 10]}>
<RigidBody type="fixed" colliders="trimesh" rotation={[0, Math.PI, 0]}>
<primitive object={slopes.scene} />
</RigidBody>
<Text
rotation={[0, Math.PI, 0]}
position={[3.5, 3, 0]}
color="black"
fontSize={0.5}
>
23.5 Deg
</Text>
<Text
rotation={[0, Math.PI, 0]}
position={[0, 4.5, 0]}
color="black"
fontSize={0.5}
>
43.1 Deg
</Text>
<Text
rotation={[0, Math.PI, 0]}
position={[-3.5, 7, 0]}
color="black"
fontSize={0.5}
>
62.7 Deg
</Text>
</group>
);
}Screen.Recording.2024-10-12.at.2.39.47.PM.mp4
Metadata
Metadata
Assignees
Labels
No labels