p5实现三维秃顶人物头部可旋转效果代码
代码语言:html
所属分类:三维
代码描述:p5实现三维秃顶人物头部可旋转效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> html, body { margin: 0; padding: 0; background: black; } /*shows how to center a div in its container*/ canvas { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 50%; height: 50%; padding: 20px; text-align: center; } </style> </head> <body> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/p5.1.4.0.js"></script> <script> //click on the sketch and then press a key to interact //Birb's nest challenge - I was tempted to code a glitching wren (they naturally glitch), but instead went with whatever this is... let r = 100; let glitchOn = false; let nBorbs = 1; function setup() { createCanvas(windowWidth, windowHeight, WEBGL); noStroke(); angleMode(DEGREES); smooth(); } function draw() { orbitControl(); background(50); ambientLight(255); rotateY(40 * sin(frameCount / 4)); //glitch turns on/off with keypress if (glitchOn) { t++; //time used for glitching strokeWeight(0.2); stroke(255); glitch(); if (frameCount % 200 === 0) { box(random(0, 1000), random(0, 1000), random(0, 100)); } if ( frameCount % 280 === 0 || frameCount % 281 === 0 || frameCount % 282 === 0) { push(); scale(3, 3); //borb body ambientMaterial(100 + t % 155, 200, 255); sphere(r, 24, 24); //borb parts push(); scale(1 + 0.5 * sin(t), 1 + 0.5 * sin(t)); borbEyes(); pop(); borbBeak(); borbLegsWings(); pop(); } } else { t = 0; noStroke(); } //borb body ambientMaterial(100 + t % 155, 200, 255); sphere(r, 24, 24); //borb parts push(); scale(1 + 0.5 * sin(t), 1 + 0.5 * sin(t)); borbEyes(); pop(); borbBeak(); borbLegsWings(); } function glitch() { ambientMaterial(255); push(); translate(r * cos(90 + t) * sin(-20), r * sin(-20), r * cos(-20)); .........完整代码请登录后点击上方下载按钮下载查看
网友评论0