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> //quick sketch for #wccchallenge - foggy forest //I wanted to stick to one color //abstract composition with bubbles for fog //click to change let forêt = []; //a forest is but an array of trees - a thought let nArbre; let t; let c; function setup() { c = 600; cnv = createCanvas(c, c); //stretching this canvas nArbre = int(random(5, 40)); for (let i = 0; i < nArbre; i++) { //to then plant seeds forêt.push(new Arbre(height / 3 + (i * height) / (1.5 * nArbre), i)); } //to grow in filtered light c = createVector(random(10, 60), random(10, 60), random(10, 60)); noStroke(); } function draw() { background(c.x, c.y, c.z); t = frameCount / 1000; //time moves thought for (let i = 0; i < nArbre; i++) { //paint the trees forêt[i].display(); } } class Arbre { constructor(dy, i) { this.x = random(0, c); //each life has a duration this.thickness = random(15, 25); //each tree has its depth into the shadows this.dy = dy; //what dreams bend this one... this.bend1 = random(2, 10); this.bend2 = random(2, 10); //fog is but a veil this.brouillard = []; //with a density around this body - a light this.fCount = int(random(50, 100 + 5000.........完整代码请登录后点击上方下载按钮下载查看
网友评论0