I created an Orbital Controls with a boxGeometry to render a box. However, when I zoom to my desired distance from the box, the corners of the box do not get rendered like so:

I am currently using react-three-fiber and react-three-drei
const SceneItems = () => {
return (
<>
<OrbitControls
minDistance={0.001}
/>
<ambientLight intensity={0.5} />
<spotLight position={[10, 15, 10]} angle={0.3} />
<Cube />
</>
)
}
const CompleteScene = () => {
return (
<div id={styles.scene}>
<Canvas
camera={{ position: [0, 0, 0] }}
orthographic={true}
>
<SceneItems />
</Canvas>
</div>
)
}
I figured I could reduce the minDistance on the OrbitalControls but to no effect. What am I missing?
Not sure if this counts as a complete answer, but for whatever reason when I remove the camera property in <Canvas> I am finally able to get the result that I want. I think since <Canvas/> provides a perspectiveCamera by default and I added the props there, it overrode my added orbitalControls.
