如何通过 react-three/fiber 和 react-three/drei 中的代码平移相机

Question

我可以使用带有OrbitControls 的鼠标将相机从默认位置[0,0,0] 平移到[100,100,0]。但是仍然无法通过代码进行平移。

<Canvas
        camera={{
          position: [0, 0, 100],
          up: [0, 0, 1],
        }}
      >
        <OrbitControls />
        <ambientLight />
        <FakeSphere position={[0, 0, 0]} color="red" />
        <FakeSphere position={[100, 100, 0]} color="blue" />
      </Canvas>

请有什么想法。

Answer 1

我们需要将相机移动到 [100,100,100] 并注视到 [100,100,0]

useEffect(() => {
    if (!controls || !camera) return;

    camera.position.set(100, 100, 100);
    controls.target.set(100, 100, 0);
  }, [camera, controls]);