three.js模拟相机移动

TODO

• 视角上下
• 方向 根据当前角度变换

//只允许一个键起作用
    let animationFrameID: ReturnType<typeof requestAnimationFrame> | null =
      null; //保存动画id

    const cameraMove = (key: "x" | "y" | "z", val: number) => () => {
      camera.position[key] += val;
      // controls.object.position[key] += val;
//      controls.target[key] += val;
      animationFrameID = requestAnimationFrame(cameraMove(key, val));
    };

    const move: { [key: KeyboardEvent["key"]]: ["z" | "x" | "y", number] } = {
      w: ["z", 1],
      a: ["x", -1],
      s: ["z", -1],
      d: ["x", 1],
    };
    let currentKey = "";
    window.addEventListener("keydown", ({ key }) => {
      if (animationFrameID) return;
      const handle = move[key];
      if (handle) {
        currentKey = key;
        cameraMove(...handle)();
      }
    });

    window.addEventListener("keyup", ({ key }) => {
      console.log(key + " up");
      if (key === currentKey) {
        window.cancelAnimationFrame(animationFrameID as number);
        animationFrameID = null;
      }
    });