canvas实现漩涡动画效果代码-html代码-BFW代码库

canvas实现漩涡动画效果代码

代码语言：html

所属分类：动画

代码描述：canvas实现漩涡动画效果代码

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

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

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

  
  
<style>
* {
  background: black;
  margin: 0;
}
</style>

  
  
</head>

<body translate="no">
  
  
      <script >
const canvas = document.createElement("canvas");
const c = canvas.getContext("2d");

canvas.width = innerWidth;
canvas.height = innerHeight;
document.body.append(canvas);

const TWO_PI = 2 * Math.PI;

class Dot {
  constructor(id, x, y, theta, parent) {
    this.x = x;
    this.y = y;
    this.t = theta;
    this.vx = Math.cos(this.t) * Math.random() * 2;
    this.vy = Math.sin(this.t) * Math.random() * 2;
    this.life = 30;
    this.col = parent.col;

    if (Math.random() < 0.005) this.other = true;
    if (this.other) {
      this.life = 1000;
      this.t = Math.random() * 7;
      this.vx = Math.cos(this.t) * Math.random() * 2;
      this.vy = Math.sin(this.t) * Math.random() * 2;
      this.col = "black";
    }
    this.iter = 0;
    this.parent = parent;
    this.id = id;
    .........完整代码请登录后点击上方下载按钮下载查看