Three.js 中的粒子 ID 和检索多个 ID

Question

我正在尝试使用 Three.js 创建粒子，目前作为粒子系统。 该项目的目标是创建具有定义位置和唯一 ID 的粒子，并添加一个选项来选择多个粒子并检索其 ID。

我做了一些研究，但只找到了检测鼠标单击位置的方法。

所以，我正在寻找以下信息：

第一：是否有一个选项可以将 ID 分配给单个粒子（就像数字一样简单）？ 第二：有没有办法选择多个粒子并在（弹出）窗口中查看它们的 ID？

感谢您的帮助！

PS：我发现，您可以将 ID 分配给 THREE.ParticleDOMMaterial （我不知道，这个函数的作用是什么！？）和 THREE.ParticleBasicMaterial （将 ID 分配给材质，但不能分配给粒子本身）。

Answer 1

默认情况下，所有 Object3D 实例在 Three.js 中都有一个唯一的 id，并且 Particle 继承了该 ID。另外，Object3D 有一个 name 属性（如果有帮助的话）。

下面是一个小片段，说明了粒子的命名：

for ( var i = 0; i < 100; i++ ) {

                    particle = new THREE.Particle( new THREE.ParticleCanvasMaterial( { color: Math.random() * 0x808008 + 0x808080, program: program } ) );
                    particle.name = "particle"+i;
                    particle.position.x = Math.random() * 2000 - 1000;
                    particle.position.y = Math.random() * 2000 - 1000;
                    particle.position.z = Math.random() * 2000 - 1000;
                    particle.scale.x = particle.scale.y = Math.random() * 10 + 5;
                    group.add( particle );
                }

这是一个鼠标按下事件处理程序的示例，它在控制台中打印所单击粒子的名称和 ID：

function onDocumentMouseDown( event ) {

                event.preventDefault();

                var vector = new THREE.Vector3( ( event.clientX / window.innerWidth ) * 2 - 1, - ( event.clientY / window.innerHeight ) * 2 + 1, 0.5 );
                projector.unprojectVector( vector, camera );

                var ray = new THREE.Ray( camera.position, vector.subSelf( camera.position ).normalize() );

                var intersects = ray.intersectScene( scene );

                if ( intersects.length > 0 ) {

                    console.log("you clicked particle named '" + intersects[0].object.name + "' with id: " + intersects[0].object.id);

                }

            }

祝你好运！