请解释three.js Raycaster方向参数 [英] Please explain three.js Raycaster direction parameter

问题描述

我试图从在Three.js场景中布置的网格中获取碰撞检测。我对Raycaster reallu的工作方式以及正确的方法感到困惑。

I am trying to get collision detection from meshes i lay out on my Three.js scene. I am confused on how the Raycaster reallu works and if i get it right.

在这里摆弄我描述问题的小玩意儿

Here is a fiddle to descripe what i have problem with

//Add cuba at 40/40
geometry = new THREE.CubeGeometry(20, 20, 20);
material = new THREE.MeshNormalMaterial();
mesh = new THREE.Mesh(geometry, material);
mesh.position.setY(40)
scene.add(mesh);


//Add Ray    
var origin = new THREE.Vector3(50, 0, 0),
    direction = new THREE.Vector3(-1,0,0),
    ray = new THREE.Raycaster(origin, direction),
    collisionResults = ray.intersectObjects([mesh]);
if(collisionResults.length!==0){
   alert('Ray collides with mesh. Distance :' + collisionResults[0].distance)
}

//Add Arrow to show ray
scene.add( new THREE.ArrowHelper(direction, origin, 50, 0x000000));

不起作用：
http://jsfiddle.net/FredricBerling/LwfPL/1/

工作：
http://jsfiddle.net/FredricBerling / LwfPL / 3 /

基本上，小提琴布置了一个立方体，并以50点形式向方向射击。问题似乎是，即使它不应该说出命中。

Basically the fiddle lays out a cube and the 50 points form that i shoot a ray in a "direction". Problem seems to be that it states a "hit" even if it shouldnt.

我布置了一个Arrowhelper来显示我怀疑Raycaster会在哪里射击。

I lay out a Arrowhelper to show where i suspect the Raycaster shoots its ray.

从其他测试来看，Raycaster中的方向似乎与Arrowhelper中的方向不同。 Raycaster似乎将射线射入场景的0,0,0。

From other tests it seems like the direction in Raycaster is different from the one in Arrowhelper. Raycaster seems to shoot the ray into the 0,0,0 of the scene. I am confused

编辑！罗布给出了答案。我需要确保已渲染网格，以便应用世界矩阵。小提琴已更新为可以正常测试Raycaster的正确代码。

推荐答案

您明显的误报重新看到是由于这样一个事实，即使您已经设置了盒子的位置，它的世界转换矩阵仍未更新。通常只会在渲染之前发生。

The apparent false positive you're seeing is due to the fact that even though you have set the box's position, it hasn't yet had its world transformation matrix updated. This normally only happens just before rendering.

如果将光线投射测试移至第一次渲染之后（或调用 updateWorld（）手动），您将不会受到打击。

If you move the raycast test to after the first render (or call updateWorld() manually), you won't get a hit.

这篇关于请解释three.js Raycaster方向参数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！