Three.js raycast产生空的交叉数组

时间:2013-01-02 23:22:27

标签: javascript three.js raycasting

我正在尝试检测用户何时点击了我的3D场景中的特定多维数据集 我见过几个类似的问题,但似乎没有一个问题跟我一样。

我有一个立方体的3D数组,它可以填充并显示正常但是当调用我的鼠标按下功能时,相交数组总是空的 - 我看不出有什么问题,并且会感激任何帮助。

我的渲染器设置如下:

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/

查看当前正在执行的项目

1 个答案:

答案 0 :(得分:8)

您需要将一个对象数组传入

var intersects = raycaster.intersectObjects( objects );

如果对象数组是分层的(即其中一个对象有一个子对象),那么你需要用这种方式指定它:

var intersects = raycaster.intersectObjects( objects, true );

您也可以传递scene.children

此功能不适用于“立方体”数据结构。

three.js r.54