canvas实现色彩斑斓圆点组成太阳旋转动画效果代码-html代码-BFW代码库

canvas实现色彩斑斓圆点组成太阳旋转动画效果代码

代码语言：html

所属分类：动画

代码描述：canvas实现色彩斑斓圆点组成太阳旋转动画效果代码

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

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

<head>
  <meta charset="UTF-8">
  

  
  
<style>
html, body { margin: 0px; min-height: 100%; background: black; overflow: hidden;}
canvas {position: absolute; top: 0px; left: 0px;}
</style>


  
</head>

<body >
  <canvas id="layer2"></canvas>
    <canvas id="layer1"></canvas>
  
      <script >
W = window.innerWidth;
H = window.innerHeight;

function makeCanvas(x) {
  Elem = document.getElementById(x);
  Elem.width = W;
  Elem.height = H;
  return Elem.getContext('2d');
}

Canvas = makeCanvas('layer1');
Canvas2 = makeCanvas('layer2');


Color = ['white', 'rgb(255, 251, 181)', 'rgb(255, 246, 84)', 'rgb(255, 232, 84)', 'rgb(227, 198, 14)', 'rgb(212, 167, 19)', 'rgb(184, 142, 6)'];
DU = 0.3;
Size = Math.min(400, H / 2 - 50, W / 2 - 50);
var PQ = Math.PI / 180;


function drawDot(C, x, y, lw, c) {
  C.strokeStyle = c;
  C.lineWidth = lw;
  C.lineCap = "round";
  C.stroke(new Path2D(`M ${W / 2 - -x} ${H / 2 - -y} h 0.1`));
}

Particles = [];
F = f => Math.floor(f);
R = r => Math.random() * r;
Ri = r => Math.floor(Math.random() * r);
sR = () => Math.random() < 0.5 ? 1 : -1;
qR =.........完整代码请登录后点击上方下载按钮下载查看