用p5.js制作烟花特效的示例代码

function setup() { //processing初始化设置
 createCanvas(window.innerWidth, window.innerHeight);
 frameRate(50);
 imageMode(CENTER);
}

function draw() { //循环执行，达成画面渲染效果
 background(0, 0, 40);
 for (var i = 0; i 

function Fireworks(radius) {
 var num = 512; //一发烟花里，有多少个点 (比较吃机器)
 var centerPosition = new p5.Vector(random(width / 8, width * 7 / 8), random(height / 2, height * 4 / 5), random(-100, 100)); //烟花的中心位置
 var velocity = new p5.Vector(0, -22, 0);
 var accel = new p5.Vector(0, 0.4, 0);
 var img;
 var firePosition = [];
 var cosTheta;
 var sinTheta;
 var phi;
 var colorChange = random(0, 5);

 for (var i = 0; i =3.8){
  img=createLight(0.9,random(0.2,0.5),random(0.2,0.5));
 }else if(colorChange>3.2){
  img=createLight(random(0.2,0.5),0.9,random(0.2,0.5));
 }else if(colorChange>2){
  img=createLight(random(0.2,0.5),random(0.2,0.5),0.9);
 } else {
  img=createLight(random(0.5,0.8),random(0.5,0.8),random(0.5,0.8));
 }


 this.display = function () {
  for (var i = 0; i  height) {
   return true;
  } else {
   return false;
  }
 }
}

function createLight(rPower, gPower, bPower) {
 var side = 64;
 var center = side / 2.0;
 var img = createImage(side, side);
 img.loadPixels();
 for (var y = 0; y 

function keyPressed() { //每事件添加一发烟花
 fireworks.push(new Fireworks(80)); //80为烟花初始半径
}

function touchStarted() { //每事件添加一发烟花
 fireworks.push(new Fireworks(80));
 return false;
}