Three.js raycast 产生空的相交数组 [英] Three.js raycast produces empty intersects array
问题描述
我试图检测用户何时点击了我的 3d 场景中的特定立方体我看过一些类似的问题,但似乎没有一个和我有完全相同的问题.
I'm trying to detect when the user has clicked on a specific cube in my 3d scene I've seen a few similar questions but none seem to have quite the same problem as me.
我有一个 3D 立方体数组,可以很好地填充和显示,但是当我的鼠标按下函数被调用时,相交数组总是空的 - 我看不出有什么问题,希望得到任何帮助.
I have a 3D Array of cubes which populates and displays fine but when my mouse down function is called, the intersect array is always empty - I can't see what's wrong and would appreciate any help.
我的渲染器设置如下:
function setupRenderer()
{
renderer = new THREE.WebGLRenderer({antialias: true});
renderer.setSize(window.innerWidth, window.innerHeight);
renderer.setClearColorHex( 0xEEEEEE, 1 );
renderer.domElement.addEventListener( 'mousedown', onDocumentMouseMove, false );
$('body').append(renderer.domElement);
}
事件处理程序是:
function onDocumentMouseDown(event)
{
console.log("mouse clicked!");
event.preventDefault();
if(event.target == renderer.domElement)
{
var mouseX = (event.clientX / window.innerWidth)*2-1;
var mouseY = -(event.clientY /window.innerHeight)*2+1;
var vector = new THREE.Vector3(mouseX, mouseY, 0.5);
projector.unprojectVector(vector, camera);
var raycaster = new THREE.Raycaster(camera.position, vector.subSelf(camera.position).normalize());
var intersects = raycaster.intersectObjects(cubes);
console.log("intersects.length: " + intersects.length);
if ( intersects.length > 0 ) {
console.log("intersected objects");
/* do stuff */
}
}
}
您可以在 http://kev-adsett.co.uk/experiments/three.js/experiment1/
推荐答案
您需要将单个对象数组传入
You need to pass in a single array of objects into
var intersects = raycaster.intersectObjects( objects );
如果对象数组是分层的(即其中一个对象有一个子对象),那么你需要这样指定:
If the objects array is hierarchal (i.e., one of the objects has a child), then you need to specify it this way:
var intersects = raycaster.intersectObjects( objects, true );
你也可以传入scene.children
.
此函数不适用于您的立方体"数据结构.
This function will not work with your "cubes" data structure.
three.js r.54
three.js r.54
这篇关于Three.js raycast 产生空的相交数组的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!