多彩的世界

代码语言:html

所属分类:粒子

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

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>- A colourful world of Turbulence</title>
    <style>
        body {
            font-family: Arial, Helvetica, "Liberation Sans", FreeSans, sans-serif;
            background-color: #000;
            margin: 0;
            padding: 0;
            border-width: 0;
        }
    </style>

</head>
<body translate="no">

    <script>
        "use strict";

        /**
        * Written by Dillon https://codepen.io/Dillo
        *
        * Inspired in very large part by Alex Andrix's work on Codepen
        * https://codepen.io/alexandrix/pen/jgyWww
        * @author Alex Andrix <alex@alexandrix.com>
        * @since 2019
        */



        const nbEddies = 5;
        const nbParticles = 1000; // number of particles
        const lifeTime = 1000; // average lifetime of particles

        let canv, ctx; // canvas and drawing context
        let maxx, maxy; // size of client Window
        let dimx, dimy; // size of canvas

        let eddies; // array of eddies
        let particles; // array of particles

        let requestID; // ID provided by window.requestAnimationFrame();
        let hueShift;

        /* shortcuts for Math */

        const mrandom = Math.random; // see above alternative function for reproductible results
        const mfloor = Math.floor;
        const mround = Math.round;
        const mceil = Math.ceil;
        const mabs = Math.abs;
        const mmin = Math.min;
        const mmax = Math.max;

        const mPI = Math.PI;
        const mPIS2 = Math.PI / 2;
        const m2PI = Math.PI * 2;
        const msin = Math.sin;
        const mcos = Math.cos;
        const matan2 = Math.atan2;
        const mexp = Math.exp;

        const mhypot = Math.hypot;
        const msqrt = Math.sqrt;

        //-----------------------------------------------------------------------------
        // miscellaneous functions
        //-----------------------------------------------------------------------------

        function alea(min, max) {
            // random number [min..max[ . If no max is provided, [0..min[

            if (typeof max == 'undefined') return min * mrandom();
            return min + (max - min) * mrandom();
        }

        // - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

        function intAlea(min, max) {
            // random integer number [min..max[ . If no max is provided, [0..min[

            if (typeof max == 'undefined') {
                max = min; min = 0;
            }
            return mfloor(min + (max - min) * mrandom());
        } // intAlea

        //------------------------------------------------------------------------
        function createEddy() {

            return {
                x: alea(dimx),
                y: alea(dimy),
                /*
                      x: dimx / 2,
                      y: dimy / 2,
                   */
                //   coeffR: 0.0,        // coefficient for radial velocity
                coeffR: 0.001 * alea(0.7, 1.3),
                // coefficient for radial velocity
                radius: 150 + alea(-50, 50),
                // radius where angular velocity is max
                coeffA1: 10000 * alea(0.8, 1.2),
                // coefficient in exponent for angular velocity
                coeffA2: 0.01 * alea(0.8, 1.2),
                // multiplying coefficient for angular velocity
                dir: mrandom() > 0.5 ? 1: -1 // direction of rotation
            };

        } // createEddy

        // - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
        function createEddies() {
            eddies = []; // create empty array;
            for (let k = 0; k < nbEddies; ++k) {
                eddies.push(createEddy());
            } // for k
        } // createEddies

        //------------------------------------------------------------------------
        function createParticle() {

            return {
                x: alea(-100, dimx + 100),
                y: alea(-100, dimy + 100),
                sat: `${intAlea(50, 101)}%`,
                light: `${intAlea(30, 80)}%`,
                TTL: alea(lifeTime * 0.8, lifeTime * 1.2) // time to live
            };
        } // createParticle
        // - - - - - - - - - - - - - - - - - - - - - - .........完整代码请登录后点击上方下载按钮下载查看

网友评论0