From d12d58f9df8a8a05466496e12f2dbd02e8f51a31 Mon Sep 17 00:00:00 2001 From: luxiaotao1123 <t1341870251@163.com> Date: 星期日, 05 五月 2024 16:29:49 +0800 Subject: [PATCH] # --- src/components/agv.jsx | 140 +++++++++++++++++++++++++++++++++++++--------- 1 files changed, 112 insertions(+), 28 deletions(-) diff --git a/src/components/agv.jsx b/src/components/agv.jsx index d670e81..8de561a 100644 --- a/src/components/agv.jsx +++ b/src/components/agv.jsx @@ -5,36 +5,106 @@ import Box from './box'; import * as Common from '../utils/common'; import * as TWEEN from "@tweenjs/tween.js"; -import { INTERVAL_TIME } from '@/config/setting' - -let lastData = {}; - -// TWEEN.Easing.Linear.None 鍖�閫熷姩鐢� -// TWEEN.Easing.Quadratic.InOut 鍦ㄥ姩鐢荤殑寮�濮嬪拰缁撴潫闃舵锛岄�熷害杈冩參锛岃�屽湪涓棿闃舵閫熷害杈冨揩 -const TWEEN_EASING = TWEEN.Easing.Linear.None; +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 coords = useRef({ 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(() => { if (!props || Object.keys(props).length === 0) { return; } + + // group position + // const pos = { + // x: position?.[0], + // y: position?.[1], + // z: position?.[2], + // } const pos = { - x: props.position[0], - y: 0, - z: props.position[2], + 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, } - new TWEEN.Tween(coords.current) - .to(pos, INTERVAL_TIME) - .easing(TWEEN_EASING) - .onUpdate((e) => { - console.log(e); - }) - .start(); + 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 + const loaderAbsoluteAngle = (theta + loaderTheta) % 360; + if (integrateTheta !== loaderAbsoluteAngle) { + const minTheta = Common.minDiffTheta(integrateTheta, loaderAbsoluteAngle); + 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) => { @@ -46,6 +116,7 @@ if (!fbx.castShadow) { Common.setShadow(fbx); } + fbx.scale.set(MODEL_AGV_SCALE, MODEL_AGV_SCALE, MODEL_AGV_SCALE); return fbx.clone(); }, []) @@ -54,6 +125,7 @@ if (!fbx.castShadow) { Common.setShadow(fbx); } + fbx.scale.set(MODEL_AGV_SCALE, MODEL_AGV_SCALE, MODEL_AGV_SCALE); return fbx.clone(); }, []) @@ -62,23 +134,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={[coords.current.x, coords.current.y, coords.current.z]} + 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