webgl+canvas实现彩色噪点运动动画效果代码-html代码-BFW代码库

webgl+canvas实现彩色噪点运动动画效果代码

代码语言：html

所属分类：动画

代码描述：webgl+canvas实现彩色噪点运动动画效果代码

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

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

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


  
  
<style>
body {
  height: 100vh;
  margin: 0;
}
body, html, #glcanvas {
overflow: hidden
}
canvas {
  display: block;
  width: 100vw;
  height: 100vh;
}
</style>


  
  
</head>

<body translate="no">
  <canvas id="glcanvas"></canvas>
  <script id="vertex-shader" type="x-shader/x-vertex">
    attribute vec2 a_position;
    void main() {
      gl_Position = vec4(a_position, 0.0, 1.0);
    }
  </script>
<script id="fragment-shader" type="x-shader/x-fragment">
#ifdef GL_ES
precision mediump float;
#endif

uniform float u_time;
uniform vec2 u_resolution;

vec3 palette( float t ) {
    vec3 a = vec3(0.5, 0.5, 0.5);
    vec3 b = vec3(0.5, 0.5, 0.5);
    vec3 c = vec3(1.0, 1.0, 1.0);
    vec3 d = vec3(0.25,0.4,0.0);

    return a + b*cos( 6.28318*(c*t+d) );
}
float oscillate(float time, float minVal, float maxVal) {
    float sineWave = sin(time);
    float normalizedSine = (sineWave + 1.0) / 2.0;
    return mix(minVal, maxVal, normalizedSine);
}

vec3 getRayDirection(vec2 uv, vec.........完整代码请登录后点击上方下载按钮下载查看