3 thoughts on “How to control camera movement with up,down,left,right keys on the keyboard

  1. I have added keydown event listener function, But the camera is not moving when press left,right,up,down arrow.I don’t konw why. This is my relevant code :

    document.addEventListener(‘keydown’,onDocumentKeyDown,false);
    function onDocumentKeyDown(event){
    var delta = 200;
    event = event || window.event;
    var keycode = event.keyCode;
    switch(keycode){
    case 37 : //left arrow 向左箭头
    camera.position.x = camera.position.x – delta;
    break;
    case 38 : // up arrow 向上箭头
    camera.position.z = camera.position.z – delta;
    break;
    case 39 : // right arrow 向右箭头
    camera.position.x = camera.position.x + delta;
    break;
    case 40 : //down arrow向下箭头
    camera.position.z = camera.position.z + delta;
    break;
    }
    document.addEventListener(‘keyup’,onDocumentKeyUp,false);
    }
    function onDocumentKeyUp(event){
    document.removeEventListener(‘keydown’,onDocumentKeyDown,false);
    }

  2. I have changed switch statement,But it doesn’t work. the changed switch statement is like this :
    switch(keycode){
    case 37 : //left arrow 向左箭头
    camera.position.x = camera.position.x – delta;
    camera.updateProjectionMatrix();
    break;
    case 38 : // up arrow 向上箭头
    camera.position.z = camera.position.z – delta;
    camera.updateProjectionMatrix();
    break;
    case 39 : // right arrow 向右箭头
    camera.position.x = camera.position.x + delta;
    camera.updateProjectionMatrix();
    break;
    case 40 : //down arrow向下箭头
    camera.position.z = camera.position.z + delta;
    camera.updateProjectionMatrix();
    break;
    }

  3. Check out the examples that starts with “misc_camera_” for different type of keyboard/mouse-based camera controls.

Comments are closed.