| | |
| | | import { useFBX, useAnimations } from '@react-three/drei'; |
| | | import * as THREE from 'three'; |
| | | import Box from './box'; |
| | | import * as Common from '../utils/common' |
| | | 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; |
| | | |
| | | const Agv = (props) => { |
| | | const { position, theta } = props; |
| | | |
| | | useEffect(() => { |
| | | const [groupPos, setGroupPos] = useState({ x: 0, y: 0, z: 0 }); |
| | | const coords = useRef({ x: 0, y: 0, z: 0 }); |
| | | |
| | | useEffect(() => { |
| | | if (!props || Object.keys(props).length === 0) { |
| | | return; |
| | | } |
| | | const pos = { |
| | | x: props.position[0], |
| | | y: 0, |
| | | z: props.position[2], |
| | | } |
| | | new TWEEN.Tween(coords.current) |
| | | .to(pos, INTERVAL_TIME) |
| | | .easing(TWEEN_EASING) |
| | | .onUpdate((e) => { |
| | | console.log(e); |
| | | }) |
| | | .start(); |
| | | }, [props]); |
| | | |
| | | useFrame((state, delta) => { |
| | | TWEEN.update(); |
| | | }) |
| | | |
| | | const bodyModel = useMemo(() => { |
| | |
| | | |
| | | return ( |
| | | <> |
| | | <group rotation-y={Common.rotationParseNum(theta)} scale={0.5} position={position}> |
| | | <group |
| | | rotation-y={Common.rotationParseNum(theta)} |
| | | scale={0.5} |
| | | position={[coords.current.x, coords.current.y, coords.current.z]} |
| | | > |
| | | <primitive object={bodyModel} castShadow /> |
| | | <primitive object={loaderModel} castShadow position={[0, 100, 0]} /> |
| | | <primitive object={forkModel} castShadow position={[0, 120, 0]} /> |