three实现随机线条组合图形动画效果代码-html代码-BFW代码库

three实现随机线条组合图形动画效果代码

代码语言：html

所属分类：动画

代码描述：three实现随机线条组合图形动画效果代码

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

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

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


  
  
  
  
<style>
*{ margin: 0px;}
</style>


  
  
</head>

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

<script id="fragment" type="x-shader/x-fragment">
precision highp float;

uniform vec2 u_resolution;
uniform float u_time;
  varying vec2 vUv;
 


  
void main() {
	vec2 uv = (gl_FragCoord.xy - u_resolution * .5) / u_resolution.yy + 0.5;
  
  float vTime = u_time * .5 ;
  float t = (u_time * .025) + length(uv -.5) ;
  
  vec2 uv2 = uv;

 
 
	
	vec3 color = vec3(1.);
  
  
  
	color = mix(color, 1.-color, step((sin((t *.1) + uv.x) +1.) *.5, .5));
	
	color = mix(color, 1.-color, step((cos((t *.1) + uv.y) +1.) *.5, .5));
	
	
	
	color = mix(color, 1.-color, step((cos((u_time *.15) + uv.x) +1.) *.5, .5));
	
	color = mix(color, 1.-color, step((sin((u_time *.15) + .........完整代码请登录后点击上方下载按钮下载查看