我的r3f模型无法缩放,其位置也无法更改



我试图缩放我的模型并改变它的位置,但它没有发生——我一定错过了什么。它不是webpack,因为其余的都在更新,模型正在加载。我使用gltfjsx创建了这个文件。

export default function Model({ ...props }) {
const group = useRef()
const { nodes } = useGLTF('./mymodel')
const material = useMemo(() => {
if (props.layer === DEFAULT_LAYER) return new THREE.MeshStandardMaterial({ color: new THREE.Color('rgba(62,53,105,1)'), roughness: 0.2, metalness: 0.9 })
else return new THREE.MeshBasicMaterial({ color: new THREE.Color('rgba(52,95,75,1)') })
}, [props.layer]);

return (
<group ref={group} dispose={null} position={[0,-500,0]} scale={[0.01, 0.01, 0.01]} {...props}>
<mesh geometry={nodes.Node.geometry} material={material} 
layers={props.layer} receiveShadow castShadow />
</group>
)
}
export default function App() {
return (
<>
<Canvas camera={{ position: [0, 20, 12], fov: 35, near: 0.1, far: 2000 }} gl={{ antialias: true }} onCreated={state => state.gl.setClearColor( 0xffffff, 0)}>
<Suspense fallback={null}>    
<Stage intensity={1}>
<Model layer = {DEFAULT_LAYER} />
</Stage>
</Suspense>
</Canvas>
<Loader />
</>
)
}

我已经在模型、网格和组对象中放置了比例和位置,但没有任何区别。为什么?我也不能改变相机的位置。

我的Model.jsx:导入

import {useRef, useMemo} from 'react'
import { useGLTF } from '@react-three/drei'
import * as THREE from 'three'

我的App.jsx:导入

import React, { Suspense, useRef, useMemo } from 'react'
import { Canvas, useThree, useFrame } from '@react-three/fiber'
import { Loader, useFBO, Stage, Effects, Environment, OrbitControls } from '@react-three/drei'
import Model from './FortunaDraco'
import { FXAAShader } from 'three-stdlib'
import { AdditiveBlendingShader } from './shaders/AdditiveBlendingShader'
import { VolumetricLightShader } from './shaders/VolumetricLightShader'
import './App.css'

对于任何有这个问题的人来说,这是因为阶段

最新更新