three.js - 如何获取点击平面内的 X 和 Y 坐标？

Question

three.js - 如何获取点击平面内的 X 和 Y 坐标？

3

我能够使用一个光线投射方法获取当前鼠标下的对象（本例中是一架飞机），但我想要获得鼠标位置在飞机内准确的X和Y坐标。

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

projector.unprojectVector( vector, camera );

var raycaster = new THREE.Raycaster( camera.position, vector.sub( camera.position ).normalize() );

var intersects = raycaster.intersectObject(plane, true);

if (intersects.length > 0) {
    console.log(intersects[0].point);
}

如果我的200x200平面正对着摄像头，那么intersects[0].point.x的范围应该是从-100到+100。但是当我旋转平面时，结果就会参差不齐。

我怎样才能获得一个在场景中无论平面在哪里都是-100到+100的x值？

- user2994359

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- WestLangley · Accepted Answer

使用 Raycaster 时获取物体本地坐标系中的交点，请按照以下步骤进行：

var vector = new THREE.Vector3().copy( intersects[ 0 ].point );

intersects[ 0 ].object.worldToLocal( vector );

console.log( 'local point: ', vector );

three.js r.65