gyf/camera-extrinsic-play
1
0
Fork 0
forked from HQU-gxy/camera-extrinsic-play
Code Pull Requests Activity

cute

Browse Source
This commit is contained in:
crosstyan
2025-03-24 14:41:08 +08:00
parent a5c4ef3a8f
commit 3411c07367
1 changed files with 16 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/App.tsx
View File

@ -1,7 +1,11 @@
import { Grid, useBVH, useGLTF, CameraControls, AccumulativeShadows, OrbitControls, Stats } from '@react-three/drei' import { Grid, useBVH, useGLTF, CameraControls, AccumulativeShadows, OrbitControls, Stats } from '@react-three/drei'
import { Camera, Canvas, useFrame, useThree, useLoader } from '@react-three/fiber' import { Camera, Canvas, useFrame, useThree, useLoader } from '@react-three/fiber'
import * as THREE from 'three'
import { useState } from 'react' import { useState } from 'react'
const DEFAULT_NEAR = 0.1
const DEFAULT_FAR = 5
const Scene = () => { const Scene = () => {
function Floor() { function Floor() {
return ( return (
@ -14,6 +18,17 @@ const Scene = () => {
const Axes = () => { const Axes = () => {
return <axesHelper args={[15]} /> return <axesHelper args={[15]} />
} }
const ExampleCameraView = () => {
const camera = new THREE.PerspectiveCamera(60, 4 / 3, DEFAULT_NEAR, DEFAULT_FAR)
const helper = <cameraHelper args={[camera]} />
camera.position.set(0, 5, 0)
return (
<group>
<primitive object={camera} />
{helper}
</group>
)
}
return ( return (
// Note that we don't need to import anything, All three.js objects will be treated // Note that we don't need to import anything, All three.js objects will be treated
@ -26,6 +41,7 @@ const Scene = () => {
<ambientLight intensity={0.05} /> <ambientLight intensity={0.05} />
<directionalLight castShadow position={[3.3, 6, 4.4]} intensity={5} /> <directionalLight castShadow position={[3.3, 6, 4.4]} intensity={5} />
<Floor /> <Floor />
<ExampleCameraView />
<Axes /> <Axes />
<Stats /> <Stats />
</> </>