rendering

Two particles

Multiple particle

The principle of analysis

The mathematical formula on which the luminescent particles are based is


G L O W = 0.04 ( x 2 + y 2 ) GLOW = \ frac {0.04} {\ SQRT {(x ^ + y ^ {2} {2})}}

Its corresponding mathematical function is shown as follows

Periodic changes of position follow the trigonometric functions cosine and sine

The principle is simple, but the results are amazing

Complete code with comments

#iUniform float glow = 0.04 in {0.00, 0.04}
/// @note luminescent particles
vec4 calcLight(vec4 color, vec2 pos, vec2 coord)
{
    return color * glow / distance(pos / iResolution.xy, coord / iResolution.xy);
}

void mainImage( out vec4 fragColor, in vec2 fragCoord )
{
    fragColor = vec4(0.0.0.0);


    fragColor += calcLight(
                     /// @note color changes periodically
                     vec4(abs(sin(iTime * 2.22)), abs(cos(iTime * 12.0)), abs(sin(iTime * 2.20)), 0.5),
                     /// @note position changes periodically
                     vec2(abs(cos(iTime * 2.27)), abs(sin(iTime * 4.31))) * iResolution.xy,
                     fragCoord
                 );

    fragColor += calcLight(
                     /// @note color changes periodically
                     vec4(abs(cos(iTime * 2.22)), abs(cos(iTime * 12.0)), abs(cos(iTime * 2.20)), 0.5),
                     /// @note position changes periodically
                     vec2(abs(sin(iTime * 2.27)), abs(sin(iTime * 3.3))) *  * iResolution.xy,
                     fragCoord
                 );
}
Copy the code