p5绘制曼德尔布罗特集效果
代码语言:html
所属分类:布局界面
代码描述:p5绘制曼德尔布罗特集效果
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> html, body { background: black; overflow: hidden; } </style> </head> <body translate="no" > <script type="x-shader/x-vertex" id="vshader"> precision highp float; attribute vec3 aPosition; varying vec2 vPos; void main() { vPos = (gl_Position = vec4(aPosition, 1.)).xy; } </script> <script type="x-shader/x-fragment" id="fshader"> precision highp float; uniform vec2 uResolution; uniform vec2 uPos; uniform float uScale; uniform int uShading; uniform vec3 uColorPrimary; uniform vec3 uColorSecondary; varying vec2 vPos; float mandelbrot(in vec2 p) { vec2 z = vec2(0.); float n = 0.; for (float i = 0.; i < 256.; i += 1.) { if (dot(z, z) > 16.) break; z = vec2( z.x * z.x - z.y * z.y, 2. * z.x * z.y ) + p; n = i; } return uShading == 0 ? n : n - log2(log2(dot(z, z))) + 4.; // Smooth fractal iteration: https://www.iquilezles.org/www/articles/mset_smooth/mset_smooth.htm } void main() { vec2 aspect = uResolution.xy / uResolution.y; vec2 p = uPos + uScale * vPos * aspect; float n = mandelbrot(p); vec3 color = mix(uColorPrimary, uColorSecondary, sin(n * .1)); gl_FragColor = vec4(color, 1.); } </script> <script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/p5.js"></script> <script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/dat.gui-min.js"></.........完整代码请登录后点击上方下载按钮下载查看
网友评论0