For my Three.js project, I am working on creating a snowfall with particles inside a snowball made of sphereGeometry - a traditional Christmas snowball. The particles have been generated using THREE.BufferGeometry()
, and each has been assigned an initial position in terms of x, y, z coordinates.
I'm wondering if there is a way to ensure that these particles are only visible within the sphere. Currently, I've attempted to address this by making particles outside the sphere the same color as the background, but it's not ideal.
Is there a method to make the particles outside the sphere invisible, perhaps by setting them as transparent?
Alternatively, how can I initialize the particles as a spherical cap? Any suggestions would be appreciated!
This is how I'm setting up the positions for the particles (in a parallelepiped style):
for(i=0; i<n; i++){
init_pos_y[i] = 50 + (Math.random()-0.5)*20;
init_pos_x[i] = (Math.random()-0.5)*100;
init_pos_z[i] = (Math.random()-0.5)*100;
acceleration[i] = Math.random()*1;
Within the Vertex Shader, here's how I'm handling the particle movement and color assignment (with opacity changes based on their location inside or outside the sphere):
void main(){
vec3 p = position;
p.x = initial_position_x;
p.z = initial_position_z;
if (initial_position_y - time * acceleration > -32.8 + min_level){
p.y = initial_position_y - time * acceleration;
}
else{
p.y = -33.8 + min_level;
}
float opacity;
if (p.x*p.x + p.y*p.y + p.z*p.z > 2490.0){
opacity = 0.40;
vColor = vec4( customColor, opacity );
}
else{
opacity = 1.0;
vColor = vec4( customColor2, opacity );
}
gl_Position = projectionMatrix * modelViewMatrix * vec4(p, 1.0);
vUv = projectionMatrix * vec4(p, 1.0);
gl_PointSize = 3.0*acceleration;
}