'React Three- Code a 3rd person view camera
I'm trying to set dynamic camera position behind the car implemented in a project similar to CAR using raycastVehicle
I tried to change camera's position using state/hooks, but I am unable locate car's position as useRaycastVehicle is used.
You can look at the similar code of car model at https://codesandbox.io/s/ebr0x . I'm trying to set a moving camera behind the car. Thanks for your help.
part of code handling car's physics,etc
function Vehicle({ radius = 0.7, width = 1.2, height = -0.04, front = 1.3, back = -1.15, steer = 0.75, force = 2000, maxBrake = 1e5, ...props }) {
const chassis = useRef()
const wheel1 = useRef()
const wheel2 = useRef()
const wheel3 = useRef()
const wheel4 = useRef()
const controls = useControls()
..............................................
useFrame(() => {
const { forward, backward, left, right, brake, reset } = controls.current
for (let e = 2; e < 4; e++) api.applyEngineForce(forward || backward ? force * (forward && !backward ? -1 : 1) : 0, 2)
for (let s = 0; s < 2; s++) api.setSteeringValue(left || right ? steer * (left && !right ? 1 : -1) : 0, s)
for (let b = 2; b < 4; b++) api.setBrake(brake ? maxBrake : 0, b)
if (reset) {
chassis.current.api.position.set(0, 0.5, 0)
chassis.current.api.velocity.set(0, 0, 0)
chassis.current.api.angularVelocity.set(0, 0.5, 0)
chassis.current.api.rotation.set(0, -Math.PI / 4, 0)
}
})
return (
<group ref={vehicle} position={[0, -0.4, 0]}>
<Beetle ref={chassis} rotation={props.rotation} position={props.position} angularVelocity={props.angularVelocity} />
<Wheel ref={wheel1} radius={radius} leftSide />
<Wheel ref={wheel2} radius={radius} />
<Wheel ref={wheel3} radius={radius} leftSide />
<Wheel ref={wheel4} radius={radius} />
</group>
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
