threejs第五用 射线拾取

芝婵

关注

阅读 41

2023-02-09


思路:

鼠标点击位置xy 到裁剪坐标系*inverse(projection)*inverse(view)就到了world空间 z给到1.0

连接camera.pos到这个算出来的vector3 就是射线了

           

mouse.x = (event.clientX / (1 * window.innerWidth)) * 2 - 1;
mouse.y = -(event.clientY / (1 * window.innerHeight)) * 2 + 1;
var vector = new THREE.Vector3(mouse.x, mouse.y,1.0).unproject(camera);得到那个点了 var raycaster = new THREE.Raycaster(camera.position, vector.sub(camera.position).normalize());//起始位置,方向 pos-camerapos
var result = raycaster.intersectObjects(scene.children);//这里为true则可以访问group
if (result.length > 0)
{
var intersected = result[0].object;//第一个点到的就作为打中的目标
console.log(result[0].object)
}

 

精彩评论(0)

0 0 举报