创建具有多个粒子大小的 bufferGeometry。最棒的表演？答案

【问题标题】：Create a bufferGeometry with several particles sizes. Best performance?创建具有多个粒子大小的 bufferGeometry。最棒的表演？
【发布时间】：2015-12-06 11:46:10
【问题描述】：

我创建了一个 THREE.Point 对象，使用 bufferGeometry 来渲染数千个粒子，并且我使用了 PointsMaterial 材质。我在运行时更新材质，在普通方形粒子（默认一个）与其他一些纹理和颜色之间进行更改，效果很好。

当我想创建不同大小的粒子时，问题就来了。我不能只设置一个BufferAttribute。我尝试制作一个自定义着色器，Three.js Particles of various sizes 但我无法让它工作，也许是一些三个版本的问题？我不知道。

所以我想按大小对所有粒子进行分组，并为每个粒子大小创建一个 bufferGeometry。但我不确定这是最好的方法。就性能而言，这是最佳选择吗？还是我必须创建一个自定义着色器来实现这个目标？

三个.js 版本：72

【问题讨论】：

标签： javascript three.js webgl

【解决方案1】：

this answer 中给出了您想要做的示例——只需使用示例中的 alpha 属性值来改变点大小：http://jsfiddle.net/8mrH7/196/

gl_PointSize = 8.0 * alpha; // use alpha to vary point size, instead

three.js r.73

【讨论】：

再次感谢@WestLangley，你太棒了！
让我再问你一件事，我不能在 Shader Material 中包含自定义纹理，这是我正在尝试的 jsfiddle：jsfiddle.net/JavIngka/swttpc0L/9 实际上，THREE.PointsMaterial 工作得很好好吧，但是我需要为我的粒子设置不同的大小。也许我可以以某种方式调整 PointsMaterial 以允许我设置此 alpha 值并更改我的 bufferGeometry 中的大小，并保留所有其他功能，例如设置地图或 sizeAttenuation？，请你帮忙。非常感谢！
好的，正如您在我的 jsfiddle 中看到的那样，jsfiddle.net/JavIngka/swttpc0L/12 我使用自定义纹理使其工作。现在我正在尝试包含一个 Alpha 测试，以激活我的纹理透明度...我正在逐步实现这一目标...
对不起这么多cmets，但最后我想我做到了：jsfiddle.net/JavIngka/swttpc0L/13
我想你会的。 : - )