js实现canvas彩色正方形框体穿越粒子动画效果代码-html代码-BFW代码库

js实现canvas彩色正方形框体穿越粒子动画效果代码

代码语言：html

所属分类：粒子

代码描述：js实现canvas彩色正方形框体穿越粒子动画效果代码

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

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/reset.min.css">

</head>
<body>
    <canvas id="canvas" height="600"></canvas>
    <script type="text/javascript">
        function project3D(x, y, z, vars) {

            var p,
            d;
            x -= vars.camX;
            y -= vars.camY;
            z -= vars.camZ;
            p = Math.atan2(x, z);
            d = Math.sqrt(x*x+z*z);
            x = Math.sin(p-vars.yaw)*d;
            z = Math.cos(p-vars.yaw)*d;
            p = Math.atan2(y, z);
            d = Math.sqrt(y*y+z*z);
            y = Math.sin(p-vars.pitch)*d;
            z = Math.cos(p-vars.pitch)*d;
            p = Math.atan2(x, y);
            d = Math.sqrt(x*x+y*y);
            x = Math.sin(p-vars.roll)*d;
            y = Math.cos(p-vars.roll)*d;
            return {
                x: vars.cx+x/z*vars.scale,
                y: vars.cy+y/z*vars.scale,
                d: z > 0?Math.sqrt(x*x+y*y+z*z): -1
            }
        }

        function rgb(col) {

            col += 0.000001;
            var r = parseInt((0.5+Math.sin(col)*0.5)*16);
            var g = parseInt((0.5+Math.cos(col)*0.5)*16);
            var b = parseInt((0.5-Math.sin(col)*0.5)*16);
            return "#"+r.toString(16)+g.toString(16)+b.toString(16);
        }

        function process(vars) {

            vars.........完整代码请登录后点击上方下载按钮下载查看