请解释三个.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

编辑！.罗布给出了答案.我需要确保网格被渲染，以便应用世界矩阵.Fiddle 更新了正确的代码，可以按预期测试 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.

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