Three.JS FPS 控制左右扫射

Question

我正在设置一个简单的演示来测试 FPS 的播放器控件。我让鼠标旋转相机，玩家可以使用 W-A-S-D 移动。我的问题是让玩家能够相对于相机朝向的方向左右移动所需的算法是什么？向前和向后移动的控制效果很好，但我运行在试图让左右移动正常工作时遇到了麻烦。

我正在使用 THREE.JS 和 PhysiJS（物理引擎）。

下面是我的一段代码...

    // the direction the camera is pointing in
    var cameraLookVector = this.controls.getDirection(this.vDirection);         
                
    // Player Movement
    this.v = new THREE.Vector3(0,0,0);
    if(keyboard.pressed("W")) { // Move forward
        this.v.x -= cameraLookVector.x * (Player.SPEED * delta * this.q); // works great
        this.v.z -= cameraLookVector.z * (Player.SPEED * delta * this.q);
    }
    if(keyboard.pressed("A")) { // Move left
        // Sets position relative to the world and not the direction the camera is facing
        this.v.x -= Player.SPEED * delta * this.q;
        /* Tried this but it didn't work
        this.v.x -= Math.cos(cameraLookVector * (Math.PI/180)) * (Player * delta * this.q);
        this.v.z -= Math.sin(cameraLookVector * (Math.PI/180)) * (Player * delta * this.q);
        */
    }
    if(keyboard.pressed("S")) { // Move backward
        this.v.x -= cameraLookVector.x * (Player.SPEED * delta * this.q); // works great
        this.v.z -= cameraLookVector.z * (Player.SPEED * delta * this.q);
    }
    if(keyboard.pressed("D")) { // Move right
        // Sets position relative to the world and not the direction the camera is facing
        this.v.x += Player.SPEED * delta * this.q;
    }
    
    this.bodyMesh.setLinearVelocity(this.v);

左右控件设置玩家相对于世界的位置。例如，如果我按住 'A'，播放器将开始向屏幕左侧移动，但如果我用鼠标旋转相机，播放器将移动到屏幕中。我希望玩家的左右位置相对于相机的方向更新，因此从玩家的角度来看，他们总是向左或向右扫射。

感谢您的帮助！

Answer 1

方法是创建一个新的 Vector3 并根据 camera 的旋转对其进行转换，我假设您可以通过编程方式访问它。

var coefficient = Player.SPEED * delta * this.q;

// Right vector
this.v.copy(new THREE.Vector3(1, 0, 0).applyQuaternion(camera.quaternion).multiplyScalar(coefficient));

Answer 2

计算向左或向右方向的矢量的计算强度较低的方法是使用 cameraLookVector 和常数 "up" 方向的叉积。这假设 cameraLookVector 永远不会与此 "up".

平行

在这张图片中，我们可以选择b向量作为相机看向的方向，a作为常量向上，a x b作为非单位向量在向左扫射的方向。

var vectorUp = new THREE.Vector3(0, 1, 0);


// Left vector
var coefficient = Player.SPEED * delta * this.q;

this.v.copy(new THREE.Vector3().crossVectors(vectorUp, cameraLookVector).normalize().multiplyScalar(coefficient));

Three.JS FPS 控制左右扫射

Three.JS FPS Controls Strafing Left and Right

javascript

game-physics

three.js

physijs