螺旋8字动画-html代码-BFW代码库

螺旋8字动画

代码语言：html

所属分类：动画

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

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">

<style>
body {
  display: grid;
  place-content: center;
  overflow: hidden;
  margin: 0;
  min-height: 100vh;
  background: #333333;
}

canvas {
  max-width: 90vmin;
  max-height: 90vmin;
  border-radius: .5em;
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
  background: #222222;
}
</style>

</head>
<body translate="no">
<canvas id="c" width="800" height="800"></canvas>

<script>
const _C = document.getElementById('c') /* canvas element */,
C = _C.getContext('2d') /* 2L canvas context */,
D = _C.width /* edge length of canvas square */,
O = -.5 * D /* vertical offset */,
RD = .35 * D /* distribution radius */,
UDA = 2 * Math.PI / 360,
RC = .02 * D /* a polygon's max circumradius */,
AE = Math.PI / 36 /* maximum angular deviation (error) */,
NHI = 6 /* number of hue intervals */,
AHI = 360 / NHI /* angular span of hue interval */,
NV = 6 /* number of hue variations within an interval */,
UAH = AHI / NV /* unit hue angle */,
SL = [95, 65].map(c => `${c}%`) /* saturation and lightness */,
N = 200 /* number of polygons */,
K = 2 /* decimal precision */,
M = Math.pow(10, K),IM = 1 / M,
VMAX = .5 /* max absolute value of velocity */,
POLY = Array(N) /* array of polygons */,
FN = ['line', 'move'] /* drawing functions */;

let rID = null /* request ID */,
aho = 0 .........完整代码请登录后点击上方下载按钮下载查看