你如何检测在three.js中粒子系统中的粒子上空盘旋?

时间:2013-01-09 05:15:36

标签: javascript canvas 3d three.js

我试图检测鼠标悬停在我的粒子系统中的粒子上。我正在进行的检测是这样的,并在每一帧上运行:

function check_intersections() {
    var vect = new THREE.Vector3(
         mouse.x,
         mouse.y,
        0.5
    );
    projectr.unprojectVector( vect, camera );

     var raycaster = new THREE.Ray( camera.position, vect.subSelf( camera.position ).normalize() );
     var intersects = raycaster.intersectObjects( particleSystem ); 

    if ( intersects.length > 0 ) {

        //intersects[ 0 ].object.materials[ 0 ].color.setHex( Math.random() * 0xffffff );
        noticeDiv.text('Intersection');

    }
}`

var particleSystem是我的粒子系统,里面有几千个粒子,只要它移动就定义了鼠标:

function onDocumentMouseMove( event ) {  
    // update the mouse variable
    mouse.x = ( event.clientX / window.innerWidth ) * 2 - 1;
    mouse.y = - ( event.clientY / window.innerHeight ) * 2 + 1;
}

我看过几个例子,但似乎无法将这一点弄好。

1 个答案:

答案 0 :(得分:3)

Raycaster.intersectObjects( objects )适用于THREE.Particle个数组,但不适用于particleSystem

有关在CanvasRenderer中使用它的示例,请参阅this example

WebGLRenderer不支持`THREE.Particle。

另外,请查看Raycaster.js,以便了解其工作原理。

three.js r.54