Javascript 如何在three.js中的粒子系统中检测悬停在粒子上的情况?

Javascript 如何在three.js中的粒子系统中检测悬停在粒子上的情况?,javascript,canvas,3d,three.js,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(

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

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;
}

我看了几个例子,但这一个似乎不正确

Raycaster.intersectObjects(objects)
适用于
三个粒子的数组,但不适用于
粒子系统

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

WebGLRenderer
不支持'THREE.Particle'

另外,看看
Raycaster.js
,了解它的工作原理


three.js r.54

粒子系统和使用单个粒子在性能上有什么区别?我的系统有大约3k的静止粒子,我想知道这是否太多了,不能只为每个粒子制造一个粒子,但我意识到我对性能一无所知,我只是假设它会更差。你必须进行实验。WebGLRender将具有最佳性能。请记住点击复选标记“接受”答案。如果你还有其他问题,请发表新的帖子。谢谢。你应该接受下面的正确答案。