javascript - Three.js中粒子系统的对象和 Material ？

我已经在Three.js中使用粒子系统了两个星期。我开始使用Object3D并添加了自己的Vector3和MeshBasicMaterial（以及其他材料，例如Phong和Lambert），然后有人将我打开了内置的ParticleSystem对象和BasicParticleMaterial，因为它可以被标记以进行排序，并可能具有其他优势。但是，现在通过进一步的研究，我发现它们可能已被弃用（ParticleSystem，BasicParticleMaterial），也许现在是PointCloud和PointCloudMaterial。一路上，我发现BasicParticleMaterial只能为所有粒子支持一个纹理，而且我需要使用多个纹理，因此我的问题是：


Three.js中粒子系统当前的对象和材质是什么？
它是否支持多种纹理（用于粒子的各种图像）？
如果当前的粒子系统不支持多个纹理，那么我正在考虑使用自定义材质和几何图形回到Object3D。我可能会找不到更合适的选择吗？


更新

我的具体任务是制作几百个抽象图形，每个图形由多个粒子云（10+）组成，每个粒子云由400+粒子组成。粒子是不同的手绘草图标记，因此，当每朵云中存在许多变化的标记时，整个图形都是手绘的。所有标记都从中心轻轻地脉动，就好像被一阵小风吹走一样。

我正在为此任务寻找最有效的材料和对象，该材料和对象还可以处理多种纹理，因此粒子可以是不同的阴影线。例如，下面是一个单一的粒子云（每个抽象图形都由像这样的各种形状不同的云组成），但是该云仅由一种阴影线组成，我想混合使用各种标记作为颗粒。

最佳答案

您的代码应执行以下操作（您可能未使用画布，因此您必须使用Textureloader并使用回调仅在加载精灵时添加它们。.如果看到的全部内容也请设置texture.needsUpdate = true;是黑色的精灵。

var texture1 = new THREE.Texture( canvas1 );
var texture2 = new THREE.Texture( canvas2 );
var texture3 = new THREE.Texture( canvas3 );

var material1 = new THREE.SpriteMaterial({ map: texture1 });
var material2 = new THREE.SpriteMaterial({ map: texture2 });
var material3 = new THREE.SpriteMaterial({ map: texture3 });

var sprite1, sprite2, sprite3;

var particleCloud1 = new THREE.Object3D();
for ( var i = 0; i < 100; i += 1 ) {

   sprite1 = new THREE.Sprite( material1 );
   // set position etc
   particleCloud.add( sprite1 );

   sprite2 = new THREE.Sprite( material2 );
   // set position etc
   particleCloud.add( sprite2 );

   // and on ...
}
scene.add( particleCloud1 );

这将在所有子画面之间共享纹理和材质。您应该至少可以拥有数百个，可能有数千个，尽管对其进行动画处理可能会带来非常昂贵的性能（据我所知，没有办法解决）。

您甚至可以在单个纹理图集中拥有各种纹理，并使用参数texture.offset.x，texture.offset.y，texture.repeat.x和texture.repeat.y从图集中获得正确的纹理。尽管鉴于您的用例，我认为您不会从中受益。

关于javascript - Three.js中粒子系统的对象和 Material ？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/24965163/