three+dat.gui实现无限循环彩色洞穴穿越动画效果代码-html代码-BFW代码库

three+dat.gui实现无限循环彩色洞穴穿越动画效果代码

代码语言：html

所属分类：动画

代码描述：three+dat.gui实现无限循环彩色洞穴穿越动画效果代码，可修改速度、色彩、放大、形状、旋转等参数。

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  

  
<style>
body {
        top: 0;
        margin: 0;
}
</style>


  
  
</head>

<body translate="no">
  <canvas id="starryPlanes"></canvas>

<script id="vertexShader" type="x-shader/x-vertex">
varying vec2 vUv;
void main() {
    vUv = uv;
    gl_Position = vec4(position, 1.0);
}
</script>

<script id="fragmentShader" type="x-shader/x-fragment">
uniform vec2 iResolution;
uniform float iTime;
uniform float speed;
uniform float rotation;
uniform float colorCycleSpeed;
uniform float colorIntensity;
uniform bool useSquares;
uniform bool enableTeleidoscope;
uniform float zoom;
uniform int teleidoscopeSides;
uniform float teleidoscopeRotationSpeed;

#define TIME        iTime
#define RESOLUTION  iResolution

#define ROT(a)      mat2(cos(a), sin(a), -sin(a), cos(a))

const float
  pi        = acos(-1.)
, tau       = 2.*pi
, planeDist = .9
, furthest  = 7.
, fadeFrom  = 5.
;

const vec2 
  pathA = vec2(.31, .31)
, pathB = vec2(1.0,sqrt(0.5))
;

const vec4 
  U = vec4(0, 1, 2, 3)
  ;
  
// License: Unknown, author: Matt Taylor (https://github.com/64), found: https://64.github.io/tonemapping/
vec3 aces_approx(vec3 v) {
  v = max(v, 0.0);
  v *= 0.9;
  float a = 2.51;
  float b = 0.03;
  float c = 2.43;
  float d = 0.59;
  float e = 0.14;
  return clamp((v*(a*v+b))/(v*(c*v+d)+e), 0.0, 1.0);
}

vec3 offset(float z) {
  return vec3(pathB*sin(pathA*z), z);
}

vec3 doffset(float z) {
  return vec3(pathA*pathB*cos(pathA*z), 1.0);
}

vec3 ddoffset(float z) {
  return vec3(-pathA*pathA*pathB*sin(pathA*z), 0.0);
}

vec4 alphaBlend(vec4 back, vec4 front) {
  float w = front.w + back.w*(1.0-front.w);
  vec3 xyz = (front.xyz*front.w + back.xyz*back.w*(1.0-front.w))/w;
  return w > 0.0 ? vec4(xyz, w) : vec4(0.0);
}

float pmin(float a, float b, float k) {
  float h = clamp(0.5+0.5*(b-a)/k, 0.0, 1.0);
  return mix(b, a, h) - k*h*(1.0-h);
}

float pmax(float a, float b, float k) {
  return -pmin(-a, -b, k);
}

float pabs(float a, float k) {
  return -pmin(a, -a, k);
}

float circleSquare(vec2 p, float r, float sm) {
    if (useSquares) {
        vec2 d = abs(p) - r;
        return min(max(d.x, d.y), 0.0) + length(max(d, 0.0)) - sm;
    } else {
        return length(p) - r - sm;
    }
}

vec3 palette(float n) {
  return 0.5+0.5*sin(vec3(0.,1.,2.)+n*colorCycleSpeed)*colorIntensity;
}

vec4 plane(vec3 ro, vec3 rd, vec3 pp, vec3 npp, float pd, vec3 cp, vec3 off, float n) {
  float aa = 3.*pd*distance(pp.xy, npp.xy);
  vec4 col = vec4(0.);
  vec2 p2 = pp.xy;
  p2 -= offset(pp.z).xy;
  vec2 doff   = ddoffset(pp.z).xz;
  vec2 ddoff  = doffset(pp.z).xz;
  float dd = dot(doff, ddoff);
  p2 *= ROT(dd*pi*5.*rotation);

  float d.........完整代码请登录后点击上方下载按钮下载查看