From d41e1236ab68c9dce2e66e1f7ef1182c9424d17f Mon Sep 17 00:00:00 2001 From: luxiaotao1123 <t1341870251@163.com> Date: 星期日, 05 五月 2024 16:11:32 +0800 Subject: [PATCH] # --- src/components/agv.jsx | 138 +++++++++++++++++++++++++++++++++++++++++---- 1 files changed, 125 insertions(+), 13 deletions(-) diff --git a/src/components/agv.jsx b/src/components/agv.jsx index 61e75e4..7b4e13f 100644 --- a/src/components/agv.jsx +++ b/src/components/agv.jsx @@ -3,24 +3,119 @@ import { useFBX, useAnimations } from '@react-three/drei'; import * as THREE from 'three'; import Box from './box'; -import * as Common from '../utils/common' - -let lastData = {}; +import * as Common from '../utils/common'; +import * as TWEEN from "@tweenjs/tween.js"; +import { + INTERVAL_TIME, + MODEL_AGV_SCALE, + REAL_COMPARE_MAP_SCALE, + REAL_COMPARE_MAP_OFFSET_X, + REAL_COMPARE_MAP_OFFSET_Z, +} from '../config/setting' const Agv = (props) => { - const { position, theta } = props; + const { agvNo, position, theta, height, loaderTheta, forkLength, trayList, hasBox } = props; + + const [groupPos, setGroupPos] = useState({ x: 0, y: 0, z: 0 }); + const [groupTheta, setGroupTheta] = useState(0); + const [loaderHeight, setLoaderHeight] = useState(0); + const [integrateTheta, setIntegrateTheta] = useState(0); + const [forkDis, setForkDis] = useState(0); useEffect(() => { - console.log(position); - console.log(theta); + if (!props || Object.keys(props).length === 0) { + return; + } + + // group position + // const pos = { + // x: position?.[0], + // y: position?.[1], + // z: position?.[2], + // } + const pos = { + x: position?.[0] * REAL_COMPARE_MAP_SCALE + REAL_COMPARE_MAP_OFFSET_X, + y: position?.[1] * REAL_COMPARE_MAP_SCALE, + z: position?.[2] * REAL_COMPARE_MAP_SCALE + REAL_COMPARE_MAP_OFFSET_Z, + } + if (!Common.deepEqual(groupPos, pos)) { + new TWEEN.Tween(groupPos) + .to(pos, INTERVAL_TIME) + .easing(TWEEN.Easing.Linear.None) + .onUpdate((e) => { + setGroupPos({ ...e }); + }) + .onComplete((e) => { + setGroupPos({ ...e }); + }).start(); + } + + // group theta + if (groupTheta !== theta) { + const minTheta = Common.minDiffTheta(groupTheta, theta); + new TWEEN.Tween({ value: groupTheta }) + .to({ value: minTheta }, INTERVAL_TIME) + .easing(TWEEN.Easing.Linear.None) + .onUpdate((e) => { + setGroupTheta(e.value) + }) + .onComplete((e) => { + setGroupTheta(e.value) + }).start(); + } + + // loader height + if (loaderHeight !== height) { + new TWEEN.Tween({ value: loaderHeight }) + .to({ value: height }, INTERVAL_TIME) + .easing(TWEEN.Easing.Linear.None) + .onUpdate((e) => { + setLoaderHeight(e.value) + }) + .onComplete((e) => { + setLoaderHeight(e.value) + }).start(); + } + + // loader theta + if (integrateTheta !== loaderTheta) { + const minTheta = Common.minDiffTheta(integrateTheta, loaderTheta); + new TWEEN.Tween({ value: integrateTheta }) + .to({ value: minTheta }, INTERVAL_TIME) + .easing(TWEEN.Easing.Linear.None) + .onUpdate((e) => { + setIntegrateTheta(e.value) + }) + .onComplete((e) => { + setIntegrateTheta(e.value) + }).start(); + } + + // fork lenght + if (forkDis !== forkLength) { + new TWEEN.Tween({ value: forkDis }) + .to({ value: forkLength }, INTERVAL_TIME) + .easing(TWEEN.Easing.Linear.None) + .onUpdate((e) => { + setForkDis(e.value) + }) + .onComplete((e) => { + setForkDis(e.value) + }).start(); + } }, [props]); + + useFrame((state, delta) => { + TWEEN.update(); + }) const bodyModel = useMemo(() => { const fbx = useFBX('/models/agv/body.fbx'); if (!fbx.castShadow) { Common.setShadow(fbx); } + fbx.scale.set(MODEL_AGV_SCALE, MODEL_AGV_SCALE, MODEL_AGV_SCALE); return fbx.clone(); }, []) @@ -29,6 +124,7 @@ if (!fbx.castShadow) { Common.setShadow(fbx); } + fbx.scale.set(MODEL_AGV_SCALE, MODEL_AGV_SCALE, MODEL_AGV_SCALE); return fbx.clone(); }, []) @@ -37,19 +133,35 @@ if (!fbx.castShadow) { Common.setShadow(fbx); } + fbx.scale.set(MODEL_AGV_SCALE, MODEL_AGV_SCALE, MODEL_AGV_SCALE); return fbx.clone(); }, []) - useEffect(() => { - }, []); - return ( <> - <group rotation-y={Common.rotationParseNum(theta)} scale={0.5} position={position}> + <group + rotation-y={Common.rotationParseNum(groupTheta)} + position={[groupPos.x, groupPos.y, groupPos.z]} + > <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 + position-y={loaderHeight} + rotation-y={Common.rotationParseNum(integrateTheta)} + > + <primitive object={loaderModel} castShadow position={[0, 20, 0]} /> + <group position-z={forkDis}> + <primitive object={forkModel} castShadow position={[0, 25, 0]} /> + {hasBox && <Box position={[0, 24, 0]} />} + </group> + </group> + <group> + {trayList?.[0]?.hasBox && <Box rotationY={Math.PI / 2} position={[-43, 25, 0]} />} + {trayList?.[1]?.hasBox && <Box rotationY={Math.PI / 2} position={[-43, 48, 0]} />} + {trayList?.[2]?.hasBox && <Box rotationY={Math.PI / 2} position={[-43, 71, 0]} />} + {trayList?.[3]?.hasBox && <Box rotationY={Math.PI / 2} position={[-43, 94, 0]} />} + {trayList?.[4]?.hasBox && <Box rotationY={Math.PI / 2} position={[-43, 117, 0]} />} + {trayList?.[5]?.hasBox && <Box rotationY={Math.PI / 2} position={[-43, 140, 0]} />} + </group> </group> </> ) -- Gitblit v1.9.1