p5实现方形网格线条光束流动动画效果代码
代码语言:html
所属分类:动画
代码描述:p5实现方形网格线条光束流动动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> body { margin: 0; padding: 0; height: 100vh; overflow: hidden; display: flex; align-items: center; justify-content: center; background: black; } </style> </head> <body> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/p5.1.4.0.js"></script> <script > //press space to mix and click to pause //learned noise from p5.js resource pages and this: https://openprocessing.org/sketch/1254827 let c; let sp = []; let cnt = 0; let nf, nf2; let t = 0; let playB = true; function setup() { a = random(0.01, 0.2); b = random(0.2, 0.9); c = min(windowWidth, windowHeight) * 0.9; cnv = createCanvas(c, c); initP(int(random(100,500))); r1 = random(50, 120); g1 = random(50, 150); b1 = random(80, 220); strokeWeight(0.5); frameRate(30); } function draw() { if (playB) { cnt++; t = sin(cnt / 500); translate(c / 2, c / 2); background(r1, g1, b1, 15 - t); for (let j = 0; j < 1; j++) { for (let p = 0; p < sp.length; p++) { let n = noise(sp[p].x * a, sp[p].y * a) *.........完整代码请登录后点击上方下载按钮下载查看
网友评论0