Javascript 当更改相机变换时,Three.Js光线投射不起作用,因为它是Object3D的子对象

Javascript 当更改相机变换时,Three.Js光线投射不起作用,因为它是Object3D的子对象,javascript,matrix,three.js,camera,raycasting,Javascript,Matrix,Three.js,Camera,Raycasting,因此,我创建了一个“摄影机控制器”,它创建了一个Object3D,并将其作为摄影机的父对象。 Y轴的平移和旋转将应用于Object3D,并且 X轴的旋转将应用于相机。 代码如下: function cameracontroll(cam,scene){ this.cam=cam; this.scene=scene; this.baseobject=new THREE.Object3D(); //a vector3 that hold the rotations to be applyed thi

因此,我创建了一个“摄影机控制器”,它创建了一个Object3D,并将其作为摄影机的父对象。 Y轴的平移和旋转将应用于Object3D,并且 X轴的旋转将应用于相机。 代码如下:

function cameracontroll(cam,scene){

this.cam=cam;
this.scene=scene;
this.baseobject=new THREE.Object3D();
//a vector3 that hold the rotations to be applyed
this.rot=new point(0,0,0);
//rotation speed
this.rspeed=0.002;
//move speed
this.mspeed=0.2;
//last mouse X position
this.lx=0;
//last mouse Y position
this.ly=0;
//direction indicators
this.go_up=false;
this.go_down=false;
this.go_left=false;
this.go_right=false;
this.go_forward=false;
this.go_backward=false;
//to correctly initialize mouse position
this.counthelper=0;

//init function
this.init=function(){
    this.baseobject.position=this.cam.position;
    this.baseobject.add(cam);
    this.scene.add(this.baseobject);

}

//rotation updating
this.updaterotation = function(e){
    if(this.counthelper==0){this.lx=e.clientX;this.ly=e.clientY;this.counthelper++;}
    this.rot.x= ((e.clientX-this.lx)*this.rspeed)*-1;
    this.rot.z= ((e.clientY-this.ly)*this.rspeed)*-1;
    cam.rotateX(this.rot.z);
    this.baseobject.rotateY(this.rot.x);
    this.lx=e.clientX;
    this.ly=e.clientY;
}

//position updating
this.updateposition = function(){
    if(this.goup){
        this.baseobject.translateY(this.mspeed);
    }
    if(this.godown){
        this.baseobject.translateY(-this.mspeed);
    }
    if(this.goleft){
        this.baseobject.translateX(this.mspeed);
    }
    if(this.goright){
        this.baseobject.translateX(-this.mspeed);
    }
    if(this.goforward){
        this.baseobject.translateZ(this.mspeed);
    }
    if(this.gobackward){
        this.baseobject.translateZ(-this.mspeed);
    }
    this.cam.updateMatrix();
}
})

问题是当我使用这个控制器来移动相机和他的父母 光线投射不再检测网格

这是光线投射功能

document.addEventListener('click',function(event){
    event.preventDefault();
    mouse.x = ( event.clientX / renderer.domElement.clientWidth ) * 2 - 1;
    mouse.y = - ( event.clientY / renderer.domElement.clientHeight ) * 2 + 1;
    raycaster.setFromCamera( mouse, camera );
    var intersects = raycaster.intersectObjects(scene.children);
    if (intersects.length > 0) {
        console.log("Intersects!");

    }
},false);
我尝试过“cam.updateMatrix()”和“cam.UpdateProjectMatrix”,但没有任何变化。即使相机成为Object3D的子对象,我初始化它的位置仍然相同(0,10,-4)。
任何人都知道,当我使用此控制器更改相机位置时,为什么光线投射不起作用。

因此,如果这可能会帮助有此问题的人,我尝试了一种解决方案,虽然不是最好的,但效果很好。 在单击事件的开头,我存储了摄影机的世界和相对位置,然后我将摄影机从其父对象中移除,将其位置设置为世界位置,然后将其添加到场景中。 在检查光线投射后,我将相机从场景中移除,并将其位置重置为先前存储的本地位置,最后将其添加到baseobject

document.addEventListener('click',function(event){
    var px = camera.getWorldPosition().x;
    var py = camera.getWorldPosition().y;
    var pz = camera.getWorldPosition().z;
    var pxx = camera.position.x;
    var pyy = camera.position.y;
    var pzz = camera.position.z;
    camcont.baseobject.remove(camera);
    camera.position.set(px,py,pz);
    scene.add(camera);
    event.preventDefault();
    mouse.x = ( event.clientX / renderer.domElement.clientWidth ) * 2 - 1;
    mouse.y = - ( event.clientY / renderer.domElement.clientHeight ) * 2 + 1;
    raycaster.setFromCamera( mouse, camera );
    var intersects = raycaster.intersectObjects(scene.children);
    if (intersects.length > 0) {
        console.log("intersects !!");

    }
    scene.remove(camera);
    camera.position.set(pxx,pyy,pzz);
    camcont.baseobject.add(camera);
},false);

通过使摄影机成为另一个对象的子对象,其局部变换矩阵将永远不会改变(这就是位置仍然相同的原因)。但是,
setFromCamera
使用相机的世界矩阵,该矩阵应根据父对象(r86)的方向而不同。你使用的是three.js的最新版本吗?是的,我使用的是最新版本,我注意到一个相机,当它还是孩子的时候,它的局部变换不会改变,所以我被迫提出一个性能可能很低的解决方案,但它可以工作,我会把它贴在答案上。谢谢你的回复。@sanjileo
this.baseobject.position=this.cam.position
是无效的three.js代码。看见