I've modified some code from the example at to create a simplified version without certain elements like flying cubes and jumping:
var camera, scene, renderer, controls;
var objects = [];
var raycaster;
var moveForward = false;
var moveBackward = false;
var moveLeft = false;
var moveRight = false;
var canJump = false;
var prevTime = performance.now();
var velocity = new THREE.Vector3();
var direction = new THREE.Vector3();
var vertex = new THREE.Vector3();
var color = new THREE.Color();
// Rest of the initialization and setup code
...
The current movement logic in the example has a limitation where looking down slows down movement. To fix this issue, I want to make the movement independent of the camera angle.
One solution could be changing the lines
controls.getObject().translateZ(Number( moveBackward ) - Number( moveForward ));
controls.getObject().translateX(Number( moveRight ) - Number( moveLeft ));
to
controls.getObject().position.z += Number( moveBackward ) - Number( moveForward );
controls.getObject().position.x += Number( moveRight ) - Number( moveLeft );
This adjustment works initially but introduces a new problem where movement direction changes when the camera rotates. How can I achieve movement along the z/x axis while still moving in the camera's direction independent of its angle, avoiding slowdowns when looking up or down?