当我调用camera.lookAt()时,RayCaster停止检测对象

时间:2016-09-08 08:06:42

标签: 3d three.js raycasting

每当我点击场景时,我就会打电话给你。

function onMouseDown(event) {
    controls.update();
    var position = new THREE.Vector3();
    position.setFromMatrixPosition( scene.group.children[0].matrixWorld );
    position.normalize();
    console.log(position);

    var raycaster = new THREE.Raycaster(); // create once
    var mouse = new THREE.Vector2(); // create once

    mouse.x = ( event.clientX / renderer.domElement.width ) * 2 - 1;
    mouse.y = - ( event.clientY / renderer.domElement.height ) * 2 + 1;
    //console.log(mouse);

    raycaster.setFromCamera( mouse, camera );

    console.log(raycaster.ray.direction);

    var intersects = raycaster.intersectObjects( scene.group.children , false );
    if ( intersects.length > 0 ) {
        intersects[ 0 ].object.material.color.set( 0xff0000 );
        console.log(intersects);
    }
}

最初,当我没有应用任何轮换时,点击工作,但是只要我打电话

scope.target.x = offset * Math.sin( (scope.phi + iphi) * Math.PI / 180 ) * Math.cos( (scope.theta + itheta) * Math.PI / 180 );
scope.target.y = offset * Math.cos( (scope.phi + iphi) * Math.PI / 180 );
scope.target.z = offset * Math.sin( (scope.phi + iphi) * Math.PI / 180 ) * Math.sin( (scope.theta + itheta) * Math.PI / 180 );

scope.camera.lookAt( scope.target );

RayCaster不会返回任何对象。

我还注意到,即使在旋转之后,我的raycaster也会在屏幕的同一位置给出相同的方向矢量。

然后我尝试在raycaster上手动应用旋转

var e = new THREE.Euler(((controls.phi-90)/180)*Math.PI, 0, (controls.theta/180)*Math.PI, 'XYZ');
raycaster.setFromCamera( mouse, camera );
raycaster.ray.direction.applyEuler( e );

但是现在我在附近的某个位置得到交叉点而不是在物体的确切位置。

1 个答案:

答案 0 :(得分:0)

问题是我没有根据相机旋转调用来更新世界坐标

camera.updateMatrixWorld();

相机更新解决了这个问题。