three.js - 如何在 Three.js 中自定义指针锁定控件？

Question

基于指针锁定控件的示例
http://pages.cs.wisc.edu/~lizy/mrdoob-three.js-ef5f05d/examples/misc_controls_pointerlock.html

如何修改此示例，以便我们可以使用按键上下移动以及使用鼠标滚轮或按键放大和缩小？

也欢迎提供有关自定义指针锁定控件的任何其他提示。

Answer 1

使用开关来识别按下的键。添加相应的事件监听器。

按键

var onKeyDown = function ( event ) {
    switch ( event.keyCode ) {
        case 38: // up
        case 87: // w
            moveForward = true;
            break;

        ...
    }
};

document.addEventListener( 'keydown', onKeyDown, false );

按键

var onKeyUp = function ( event ) {
    switch( event.keyCode ) {
        case 38: // up
        case 87: // w
            moveForward = false;
            break;

        ...
    }
};

document.addEventListener( 'keyup', onKeyUp, false );

鼠标滚轮

var onMouseWheel = function ( event ) {
    ...
};

this.domElement.addEventListener( 'mousewheel', onMouseWheel, false );
this.domElement.addEventListener( 'DOMMouseScroll', onMouseWheel, false ); // firefox