如何更改 GPUParticleSystem Three.js 中的粒子颜色？

Question

我可以更改生成选项颜色，但仍然有白色粒子（比如基础粒子生成颜色？）。我试图在白色 THREE.scene 中添加黑色粒子，问题是当我使用白色场景背景时，粒子系统的生成选项颜色 disappears/turns 白色。

即

  // options passed during animate() | particleSystem.spawnParticle(options)
  // particle color is now 0x3174a5 with the "white base color"

  options = {
    position: new THREE.Vector3(),
    positionRandomness: .3,
    velocity: new THREE.Vector3(),
    velocityRandomness: .5,
    color: 0x3174a5,
    ...
  };

现在，如果我将选项的 'color' 属性更改为 0x000000，则只剩下 "white base color"。

当我将场景背景更改为白色时，看不到粒子。

scene.background = new THREE.Color( 0xcccccc ); // grey background

当场景颜色为灰色（类似于 0xcccccc）时，场景颜色看起来像是叠加在粒子系统之上。

感谢任何帮助！

Answer 1

提到的白色是添加剂混合的结果。以下代码应产生您想要的视觉输出：

particleSystem.particleShaderMat.blending = THREE.SubtractiveBlending;

如何更改 GPUParticleSystem Three.js 中的粒子颜色？

How do I change particle colors in GPUParticleSystem Three.js?

javascript

shader

webgl

three.js