p5实现狂风暴雨电闪雷鸣动画效果代码-html代码-BFW代码库

p5实现狂风暴雨电闪雷鸣动画效果代码

代码语言：html

所属分类：动画

代码描述：p5实现狂风暴雨电闪雷鸣动画效果代码

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

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<style>
    body{
        padding: 0;
        margin: 0;
    }
</style>
</head>
<body>

<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/p5.js"></script>
<div></div>

<script type="text/javascript" >
    var drops = [];
var raindropSize = .2;
var droplets = 1300;
var maxDrops = 1000;
var thue;
var flig = 0;
var thickness = 21;
var tx;
var ty = 10;
var loc = 0;
var direct = -1;
var trail = .2;
var fade = 1;
var ms;
var distancy;
var mob = 0;
var xp = 1;
var yp = 1;
var value;


function setup() {

  //smooth();
  noStroke();
  colorMode(HSB, 360, 100, 50, 1);
  createCanvas(window.innerWidth, window.innerHeight);
  if (window.innerWidth < 800) mob = 1;
 if(mob == 1) droplets = droplets / 15;
   tx = random(-3, 3);
  
  for (var i = 0; i < droplets; i++) {
    var x = round((random(width / raindropSize)) * raindropSize);
    var y = round(random(height / raindropSize)) * raindropSize - window.innerHeight;
    var r = raindropSize;
    var h = map(x, 0, width, 0, 360); //(0, 360);
    var s = random(1, 19);
   //trail = random(0.26, .7);
    thue = h;
    
    distancey = random(1, window.innerHeight);
    tswell = ((distancey / window.innerHeight) * 25) * s / 2;
    drops[i] = new RainDrop(x, y, r, h, s, tswell, distancey);
  }
}



function draw() {

 var lig = random(0, 5);
  if (lig > 4.9) {flig.........完整代码请登录后点击上方下载按钮下载查看