使用 Three.js 创建下雪效果，粒子从上到下飘落，使用自定义着色器实现雪花形状。

snowMaterial = new THREE.PointsMaterial({
    size: 5,
    blending: THREE.AdditiveBlending,
    transparent: true,
});

geometry = new THREE.BufferGeometry();

let positions = new Float32Array(particles * 3);

for (let i = 0; i < particles * 3; i += 3) {
    positions[i] = Math.random() * 200 - 100;
    positions[i + 1] = Math.random() * 200 - 100;
    positions[i + 2] = Math.random() * 200 - 100;
}
geometry.setAttribute("position", new THREE.Float32BufferAttribute(positions, 3));

snowMaterial.onBeforeCompile = (shader) => {
    shader.uniforms.uColor = {
        value: new THREE.Color(0xffffff),
    };

    shader.fragmentShader = shader.fragmentShader.replace(
        `#include <common>`,
        `
            #include <common>
                uniform vec3 uColor;
            `
    );

    shader.fragmentShader = shader.fragmentShader.replace(
        `#include <premultiplied_alpha_fragment>`,
        `
            #include <premultiplied_alpha_fragment>
                float distanceLen = distance(gl_PointCoord,vec2(0.5));
                distanceLen = 1.0 - distanceLen;
                distanceLen = pow(distanceLen,10.0);
                vec4 color = vec4(uColor,distanceLen);
                gl_FragColor = color;
            `
    );
};

mesh = new THREE.Points(geometry, snowMaterial);
scene.add(mesh);

function update(time, position) {
    if (snowMaterial) {
        const positions = mesh.geometry.getAttribute("position").array;
        for (let i = 0; i < positions.length; i += 3) {
            positions[i + 1] -= 0.1;
            positions[i] -= Math.sin(i) * 0.1;
            positions[i + 2] -= Math.sin(i) * 0.1;
            if (positions[i + 1] < -100) {
                positions[i + 1] = 100;
            }
        }

        mesh.geometry.getAttribute("position").needsUpdate = true;
    }
}