Three.js Pointerlockcontrols沿y轴拍摄

时间:2015-03-27 23:38:56

标签: javascript three.js pointerlock

目前我正在使用three.js和pointerlockcontrols开发一个FPS。

使用下面的代码我可以向任何水平方向射击:

var direction = new THREE.Vector3( 0, 0, -1 );
var rotation = new THREE.Euler( 0, 0, 0, "XYZ" );
var cameraDirection = new THREE.Vector3(this.game.usermodel.root.children[0].position.x, this.game.usermodel.root.children[0].rotation._x, this.game.usermodel.root.children[0].position.z);
cameraDirection.copy( direction ).applyEuler( this.game.user.rotation );

var raycaster = new THREE.Raycaster(this.game.usermodel.root.children[0].position, cameraDirection); 

但是我的代码没有考虑y轴。下面的行保持音高旋转:

this.game.usermodel.root.children[0].rotation._x

如何应用此值以便我可以沿y轴(垂直向任何方向)拍摄?目前子弹正沿着一条直线前进。

提前感谢您的协助。

2 个答案:

答案 0 :(得分:1)

如果您正在使用PointerLockControls并且想要设置raycaster,则可以使用此模式:

var direction = new THREE.Vector3();
var raycaster = new THREE.Raycaster(); // create once and reuse
...

controls.getDirection( direction );
raycater.set( controls.getObject().position, direction );

如果使用PointerLockControls,请勿直接设置相机位置或旋转。

three.js r.71

答案 1 :(得分:0)

稍微调查一下,我终于想出了一个解决方法。它可能不是完美的方式,但它的工作原理。

它现在的工作原理如下:我得到了基本的网格旋转并应用了euler,然后我添加了音高旋转。通过这种方式,我将水平和垂直旋转传递到raycaster。

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

direction.copy( direction ).applyEuler( this.game.user.rotation );
direction.y = this.game.usermodel.root.children[0].rotation._x;

var raycaster = new THREE.Raycaster(this.game.usermodel.root.children[0].position, direction);

欢迎每个人对此发表评论或提出更优雅的解决方案。