js实现发光粒子液态流动动画效果代码
代码语言:html
所属分类:粒子
代码描述:js实现发光粒子液态流动动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
</head>
<body>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/simplex-noise.min.js"></script>
<script>
"use strict";var
PI = Math.PI,cos = Math.cos,sin = Math.sin,abs = Math.abs,sqrt = Math.sqrt,pow = Math.pow,floor = Math.floor,round = Math.round,random = Math.random,atan2 = Math.atan2;
var HALF_PI = 0.5 * PI;
var TAU = 2 * PI;
var TO_RAD = PI / 180;
var rand = function rand(n) {return n * random();};
var randIn = function randIn(min, max) {return rand(max - min) + min;};
var randRange = function randRange(n) {return n - rand(2 * n);};
var fadeIn = function fadeIn(t, m) {return t / m;};
var fadeOut = function fadeOut(t, m) {return (m - t) / m;};
var fadeInOut = function fadeInOut(t, m) {
var hm = 0.5 * m;
return abs((t + hm) % m - hm) / hm;
};
var dist = function dist(x1, y1, x2, y2) {return sqrt(pow(x2 - x1, 2) + pow(y2 - y1, 2));};
var angle = function angle(x1, y1, x2, y2) {return atan2(y2 - y1, x2 - x1);};
var lerp = function lerp(n1, n2, speed) {return (1 - speed) * n1 + speed * n2;};
var particleCount = 1000;
var spawnRadius = 100;
var noiseSteps = 6;
var canvas = void 0;
var ctx = void 0;
var center = void 0;
var tick = void 0;
var simplex = void 0;
var positions = void 0;
var velocities = void 0;
var lifeSpans = void 0;
var sizes = void 0;
var hues = void 0;
var speeds = void 0;
function setup() {
tick = 0;
center = [];
createCanvas();
createParticles();
draw();
}
function createParticles() {
simplex = new SimplexNoise();
positions = new Float32Array(particleCount * 2);
velocities = new Float32Array(particleCount * 2);
lifeSpans = new Float32Array(particleCount * .........完整代码请登录后点击上方下载按钮下载查看
网友评论0