#

luxiaotao1123

2024-04-19 078a01175c05ae2d0581b433f1c2cee238d128b7

#

 src/components/camera.jsx

@@ -1,5 +1,5 @@
// 添加场景相机
import { useThree, PerspectiveCameraProps } from '@react-three/fiber';
import React, { useState, useEffect } from 'react';
import { useThree } from '@react-three/fiber';
import {
    PerspectiveCamera,
    CameraControls,
@@ -9,14 +9,12 @@
    FirstPersonControls,
    MapControls,
} from '@react-three/drei';
import React, { useState, useEffect } from 'react';

const Camera = (props) => {
    const threeObj = useThree();
    const camera = threeObj.camera;

    const [choiceCtrls, setChoiceCtrls] = useState(true);
    const mobxStore = useContext(ThreeStoreContext);

    const flyCtrl = () => {
        return (

 src/pages/base.jsx

@@ -11,7 +11,7 @@
        <div style={{ height: '100%', width: '100%' }}>
            <Canvas>
                <Lights />
                {/* <Camera /> */}
                <Camera />
                <Sky distance={450000} sunPosition={[0, 1, 0]} inclination={0} azimuth={0.25} />
                <Box position={[0, 0, 0]} />
                <OrbitControls />
@@ -36,7 +36,7 @@
            onClick={(event) => click(!clicked)}
            onPointerOver={(event) => (event.stopPropagation(), hover(true))}
            onPointerOut={(event) => hover(false)}>
            <boxGeometry args={[1, 1, 1]} />
            <boxGeometry args={[10, 10, 10]} />
            <meshStandardMaterial color={hovered ? 'hotpink' : 'orange'} />
        </mesh>
    )