Javascript Three.js ParticleSystem透明度问题

我使用的是

Three.js

，我有一个

ParticleSystem

，其中每个粒子可能有不同的透明度和颜色

代码：

顶点着色器：

attribute float size;
attribute vec3 color;

varying vec3 vColor;

void main() {

    vColor = color;

    vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );

    //gl_PointSize = size;
    gl_PointSize = size * ( 300.0 / length( mvPosition.xyz ) );

    gl_Position = projectionMatrix * mvPosition;

}

片段着色器：

uniform sampler2D texture;
uniform float alpha;
varying vec3 vColor;

void main() {
    gl_FragColor = vec4(vColor, 100);
    vec4 textureColor =  texture2D( texture, gl_PointCoord );
    gl_FragColor = gl_FragColor *  textureColor;
    gl_FragColor.a = alpha;
}

纹理是一个圆，但当我设置alpha时，像这样：

gl\u FragColor.a=alpha

，我的纹理变成黑色正方形中的一个圆，alpha级别可以，但我不需要正方形，只有圆形如果我不设置alpha，正方形不会出现。 那么，如何为提供的纹理正确设置alpha呢？

请看以下内容：

您可以在页面的某个地方找到JSFIDLE，该页面使用

ShaderMaterial

作为

ParticleSystem

的变量alpha:

另外，至少稍微更改片段着色器，

gl\u FragColor

应为只写变量，通常不将其作为读取变量：

vec4 col = vec4(vColor, 100);
vec4 tex = texture2D( texture, gl_PointCoord );
gl_FragColor = vec4( (col*tex).rgb, alpha );

…或在一行中：

gl_FragColor = vec4( (vec4(vColor, 100) *  texture2D( texture, gl_PointCoord )).rgb, alpha);

---

谢谢，就像你在例子中所做的那样，这就是我所需要的。我简化了代码，只在vertexshader中设置alpha。属性浮动大小；属性向量3颜色；属性浮动alpha；可变vec4颜色；void main（）{vColor=vec4（颜色，alpha）；vec4 mvPosition=modelViewMatrix*vec4（位置，1.0）；gl_PointSize=size*（300.0/长度（mvPosition.xyz））；gl_position=projectionMatrix*mvPosition；}

gl_FragColor = vec4( (vec4(vColor, 100) *  texture2D( texture, gl_PointCoord )).rgb, alpha);