raindrop-fx/examples/with-node/src/index.ts

Rain drop effect with WebGL

import RaindropFX from "raindrop-fx";

const canvas = document.querySelector("#canvas") as HTMLCanvasElement;
const rect = canvas.getBoundingClientRect();
canvas.width = rect.width;
canvas.height = rect.height;

const raindropFx = new RaindropFX({
    canvas: canvas,
    background: "../../assets/img/84765992_p0.jpg",
});

window.onresize = () =>
{
    const rect = canvas.getBoundingClientRect();
    raindropFx.resize(rect.width, rect.height);
}

raindropFx.start();