p5实现粒子跟随寻找动画效果代码-html代码-BFW代码库

p5实现粒子跟随寻找动画效果代码

代码语言：html

所属分类：粒子

代码描述：p5实现粒子跟随寻找动画效果代码

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

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

<head>

    <meta charset="UTF-8">





    <style>
        body {
            padding: 0;
            margin: 0;
            overflow: hidden;
        }
    </style>


</head>

<body>
    <!-- 3D version here: https://codepen.io/sha99y8oy/pen/vKpoBQ -->
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/p5-0.5.1.js"></script>
    <script>
   var t;
var seekers = [];

function setup() {
  createCanvas(windowWidth, windowHeight);

  t = new Target();
  for (var i = 0; i < 30; i++) {
    seekers[i] = new Seeker();
  }
}

function draw() {
  background(100);

  t.update();
  t.display();

  for (var i = 0; i < seekers.length; i++) {
    seekers[i].update();
    seekers[i].seek(createVector(t.pos.x, t.pos.y));
    seekers[i].display();

    //seekers[i].seek(createVector(mouseX, mouseY));	
  }

}

function mouseReleased() {
  for (var i = 0; i < seekers.length; i++) {
    var explode = createVector(random(-width, width), random(-height, height));
    console.log(explode);
    explode.mag(10);
    seekers[i].seek(explode);
  }

}

function Seeker() {

  this.pos = createVector(random(width), random(height));
  this.vel = createVector(random(-2, 2), random(-2, 2));
  this.acc = createVector(0, 0);
  this.sz = 10;
  this.maxSpeed = random(5, 8);
  this.maxForce = random(0.025, 0.75);
  this.trail = [];

  this.display = function() {
    fill(255);
  .........完整代码请登录后点击上方下载按钮下载查看