From 51c03e5d6d3586d52603d76d76acdf13388883ab Mon Sep 17 00:00:00 2001 From: luxiaotao1123 <t1341870251@163.com> Date: 星期一, 22 四月 2024 15:19:25 +0800 Subject: [PATCH] # --- src/components/agv.jsx | 91 ++++++++++++++++++++++++--------------------- 1 files changed, 49 insertions(+), 42 deletions(-) diff --git a/src/components/agv.jsx b/src/components/agv.jsx index b756443..2f256ad 100644 --- a/src/components/agv.jsx +++ b/src/components/agv.jsx @@ -1,62 +1,69 @@ -import { useRef, useEffect } from 'react'; +import { useState, useMemo, useRef, useEffect } from 'react'; import { useFrame } from '@react-three/fiber'; import { useFBX, useAnimations } from '@react-three/drei'; -import { AnimationMixer } from 'three'; +import * as THREE from 'three'; +import Box from './box'; + +const setShadow = (obj) => { + obj.castShadow = true; + obj.receiveShadow = true; + + if (obj.children) { + obj.children.forEach((child) => { + setShadow(child); + }); + } +}; + +const setColor = (obj) => { + if (obj.material) { + obj.material.color.set(0x4680BF); + } + if (obj.children) { + obj.children.forEach((child) => { + setColor(child); + }); + } +}; const Agv = (props) => { - const fbxRef = useRef(); - const mixerRef = useRef(); + const { } = props; - const fbx = useFBX('/models/agv/body.fbx'); - - const setShadow = (obj) => { - obj.castShadow = true; - obj.receiveShadow = true; - - if (obj.children) { - obj.children.forEach((child) => { - setShadow(child); - }); + const bodyModel = useMemo(() => { + const fbx = useFBX('/models/agv/body.fbx'); + if (!fbx.castShadow) { + setShadow(fbx); } - }; + return fbx.clone(); + }, []) - const setColor = (obj) => { - if (obj.material) { - obj.material.color.set(0x4680BF); + const loaderModel = useMemo(() => { + const fbx = useFBX('/models/agv/loader.fbx'); + if (!fbx.castShadow) { + setShadow(fbx); } - if (obj.children) { - obj.children.forEach((child) => { - setColor(child); - }); - } - }; + return fbx.clone(); + }, []) - // setColor(fbx) - if (!fbx.castShadow) { - setShadow(fbx); - } + const forkModel = useMemo(() => { + const fbx = useFBX('/models/agv/fork.fbx'); + if (!fbx.castShadow) { + setShadow(fbx); + } + return fbx.clone(); + }, []) useEffect(() => { - mixerRef.current = new AnimationMixer(fbx); - if (fbx.animations.length > 0) { - useFrame((state, delta) => { - mixerRef?.current?.update(delta); - }); - - const action = mixerRef.current.clipAction(fbx.animations[0]); // 鍋囪鍙湁涓�涓姩鐢伙紝鍙互鏍规嵁瀹為檯鎯呭喌淇敼 - action.play(); - } - - return () => { - mixerRef.current.stopAllAction(); - }; }, []); return ( <> <group rotation={[0, 0, 0]} scale={0.5} position={[0, 0, 0]}> - <primitive object={fbx} castShadow /> + <primitive object={bodyModel} castShadow /> + <primitive object={loaderModel} castShadow position={[0, 100, 0]} /> + <primitive object={forkModel} castShadow position={[0, 120, 0]} /> + <Box position={[100, 100, 300]} /> </group> </> ) -- Gitblit v1.9.1