I've been messing around with react-three-fiber and really liked the OrbitControls element which lets you control the camera by dragging the mouse around.
My doubt is if there's a way to control the initial position/perspective of the element.
I'm creating a demo and I'm using a a plane to simulate the ground. It looks fine when seen from above but on the default position it becomes invisible, like looking a sheet of paper horizontally.
I tried to mess around with some properties like position and minPolarAngle but couldn't observe any difference. Any one out there could help on this one?
<Canvas>
<OrbitControls position={[10, -40, 0]} /> // 'position' doesn't seem to work
<ambientLight intensity={0.4} />
<Suspense fallback={"...Loading"}>
<Stars />
<Box/>
<Ground />
</Suspense>
</Canvas>
OrbitControls will use the existing camera and respect its initial position*, so you don't need to do anything specialized; just specify the camera prop on Canvas.
*but not its initial rotation. OrbitControls will instantly overwrite any calls to camera.lookAt. In that case, specify a target (defaults to [0,0,0]).
<Canvas camera={{ fov: 45, position: [10, -40, 0] }}>
<OrbitControls target={[10, 0, 0]} />
</Canvas>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With