canvas实现三维粒子波浪动画效果代码

代码语言:html

所属分类:粒子

代码描述:canvas实现三维粒子波浪动画效果代码

代码标签: canvas 三维 粒子 波浪 动画

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

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

<head>
    <meta charset="UTF-8">
<style>
    body{margin:0;overflow:hidden}canvas{width:100%;height:100vh}
</style>
</head>

<body><canvas id=a></canvas>

    <script>
        c=a.getContext("2d")
        var {
        sin,
        cos,
        PI,
        sqrt,
        atan2
    } = Math;
    
    function R(x, y, z) {
        x -= T, y -= I, z -= M;
        p = atan2(x, z), d = sqrt(z * z + x * x), x = sin(p - yw) * d, z = cos(p - yw) * d;
        p = atan2(y, z), d = sqrt(y * y + z * z), y = sin(p - q) * d, z = cos(p - q) * d;
        n = -9, b = 1, l = 9, d = 1, e = 0, f = 0, g = x, h = z, k = (h - f) * (l - n) - (g - e) * (d - b), m = ((g - e) * (b - f) - (h - f) * (n - e)) / k;
        return {
            x: 1000 + (n + m * (l - n)) * 900,
            y: 563 + y / z * 900
        };
    }
    
    function S(x1, y1, z1, x2, y2, z2) {
        this.a = {
            x: x1,
            y: y1,
            z: z1
        };
        this.b = {
            x: x2,
            y: y2,
            z: z2
        };
    }
    
    function A(x, y, z) {
        F = {};
        F.x = x;
        F.y = y;
        F.z = z;
        F.s = [];
        F.s.push(new S(-1, -1, -1, 1, -1, -1));
        F.s.push(new S(1, -1, -1, 1, 1, -1));
        F.s.push(new S(1, 1, -1, -1, 1, -1));
        F.s.push(new S(-1, 1, -1, -1, -1, -1));
        F.s.push(new S(-1, -1, 1, 1, -1, 1));
      .........完整代码请登录后点击上方下载按钮下载查看

网友评论0