Ray和Plane的交点坐标

时间:2012-10-05 14:44:24

标签: three.js

我有射线和飞机。光线与飞机相交,我想知道在哪里。如何获得这个交叉点的世界坐标?

(我的具体情况是我向相机取消投影屏幕坐标并创建光线。飞机是场景的基础)

var vector = new THREE.Vector3( mousePosition.x, mousePosition.y, 1 );
projector.unprojectVector( vector, camera );
var ray = new THREE.Ray(
    camera.position,
    vector.subSelf( camera.position ).normalize()
);

2 个答案:

答案 0 :(得分:9)

这是通常的模式。您可能需要根据自己的具体情况进行调整。

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

...

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( objects, recursiveFlag );

if ( intersects.length > 0 ) {

    console.log( intersects[ 0 ].point; );

}

这里,objects是一个数组。例如,

var objects = [];

objects.push( plane_mesh );

编辑:已更新为three.js r.84

答案 1 :(得分:0)

从r55开始,您可以使用此快捷方式。它类似,但简化了光线投射,甚至不必担心unprojectVector()。

这是WestLangley示例的修改版本:

    var vector = new THREE.Vector3( ( 
        event.clientX / window.innerWidth ) * 2 - 1, 
        - ( event.clientY / window.innerHeight ) * 2 + 1, 
        0.5 
    );

    var ray = projector.pickingRay( vector.clone(), camera );

    var intersects = ray.intersectObjects( objects );

    if ( intersects.length > 0 ) {

        console.log( intersects[ 0 ].point; );

    }

这假设相同的对象数组

var objects = [];

objects.push( plane_mesh );