simplex-noise实现一个闪电粒子特效动画代码

代码语言:html

所属分类:粒子

代码描述:simplex-noise实现一个闪电粒子特效动画代码

代码标签: 闪电 粒子 特效 动画

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">

<head>

    <meta charset="UTF-8">



    <style>
        * {
            margin: 0;
            padding: 0;
        }

        html,
        body {
            overflow: hidden;
        }

        body {
            position: relative;
            background-color: #000;
        }
    </style>

</head>

<body translate="no">

    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/simplex-noise.min.js"></script>

    <script>

        class Tool {
            // random number.
            static randomNumber(min, max) {
                return Math.floor(Math.random() * (max - min + 1) + min);
            }
            // random color rgb.
            static randomColorRGB() {
                return (
                    "rgb(" +
                    this.randomNumber(0, 255) +
                    ", " +
                    this.randomNumber(0, 255) +
                    ", " +
                    this.randomNumber(0, 255) +
                    ")");

            }
            // random color hsl.
            static randomColorHSL(hue, saturation, lightness) {
                return (
                    "hsl(" +
                    hue +
                    ", " +
                    saturation +
                    "%, " +
                    lightness +
                    "%)");

            }
            // gradient color.
            static gradientColor(ctx, cr, cg, cb, ca, x, y, r) {
                const col = cr + "," + cg + "," + cb;
                const g = ctx.createRadialGradient(x, y, 0, x, y, r);
                g.addColorStop(0, "rgba(" + col + ", " + ca * 1 + ")");
                g.addColorStop(0.5, "rgba(" + col + ", " + ca * 0.5 + ")");
                g.addColorStop(1, "rgba(" + col + ", " + ca * 0 + ")");
                return g;
            }
            // framerate
            static calcFPS() {
                const now = +new Date();
                const fps = 1000 / (now - lastTime);
                lastTime = now;
                return fps.toFixed();
            }}


        /*
       When want to use angle.
     */

        class Angle {
            constructor(angle) {
                this.a = angle;
                this.rad = this.a * Math.PI / 180;
            }

            incDec(num) {
                this.a += num;
                this.rad = this.a * Math.PI / 180;
                return this.rad;
            }}


        /*
       When want to use vector.
     */

        class Vector2d {
            constructor(x, y) {
                this.vx = x;
                this.vy = y;
            }

            scale(scale) {
                this.vx *= scale;
                this.vy *= scale;
            }

            add(vec2) {
                this.vx += vec2.vx;
                this.vy += vec2.vy;
            }

            sub(vec2) {
                this.vx -= vec2.vx;
                this.vy -= vec2.vy;
            }

            negate() {
                this.vx = -this.vx;
                this.vy = -this.vy;
            }

            length() {
                return Math.sqrt(this.vx * this.vx + this.vy * this.vy);
            }

            lengthSquared() {
                return this.vx * this.vx + this.vy * this.vy;
            }

            normalize() {
                let len = Math.sqrt(this.vx * this.vx + this.vy * this.vy);
                if (len) {
                    this.vx /= len;
                    this.vy /= len;
                }
         .........完整代码请登录后点击上方下载按钮下载查看

网友评论0