p5模拟细胞粒子生命周期动画效果代码-html代码-BFW代码库

p5模拟细胞粒子生命周期动画效果代码

代码语言：html

所属分类：粒子

代码描述：p5模拟细胞粒子生命周期动画效果代码

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

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

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

  
  
  
<style>
* { margin:0; padding:0; } 
html, body { width:100%; height:100%; overflow: hidden; background:black;} 
canvas { display:block; }
</style>

  
</head>

<body translate="no">
  <div id="controls"></div>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/p5-1.9.0.js"></script>
      <script id="rendered-js" >
//see https://codepen.io/tientq64/pen/gOEvxqb

let numTypes  = 5;
let goalTypes = 5;
let drag      = .15;
let numPoints = 1000;
let maxTypes  = 20;

let rInt = (b, a=0) => Math.floor(Math.random()*(b-a) + a);

class Particle{
  constructor({x, y, type=random(), dx=0, dy=0}){
    Object.assign(this, {x, y, type, dx, dy});
  }
  addForce(p){
    let entry = controlGrid[floor(this.type*numTypes)][floor(p.type*numTypes)];
    let dx = this.x-p.x;
    let dy = this.y-p.y;
    let d  = dx*dx + dy*dy;
    let f  = ((entry.goalDist*100)**2-d);
    
    let ddx = dx*f*.001/d;
    let ddy = dy*f*.001/d;
    
    this.dx += ddx + ddy*entry.strafe;
    this.dy += ddy + ddx*entry.strafe*-1;
  }
  update(){
    let d = Math.hypot(this.dx, this.dy);
    d = max(d, 2)/2;
   .........完整代码请登录后点击上方下载按钮下载查看