three+maath+webgl实现彩色点汇集动画效果代码

代码语言:html

所属分类:动画

代码描述:three+maath+webgl实现彩色点汇集动画效果代码

代码标签: three maath webgl 彩色 汇集 动画

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

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

<head>

  <meta charset="UTF-8">

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



</head>

<body >
  <div id="shader"></div>
<script id="vertex" type="x-shader/x-vertex">
	varying vec2 vUv;
uniform float uTime;

attribute vec3 position2;
varying vec3 pos;
	uniform float u_progress;
	varying float size;

void coswarp(inout vec3 trip, float warpsScale ){

    trip.xyz += warpsScale * .1 * cos(3. * trip.yzx + (uTime * .015));
    trip.xyz += warpsScale * .05 * cos(11. * trip.yzx + (uTime * .015));
    trip.xyz += warpsScale * .025 * cos(17. * trip.yzx + (uTime * .015));
    
  }  

   

  void main(){
    vec4 modelPosition = modelMatrix * vec4(position, 1.);



		modelPosition.y += sin((uTime * .02) + length(modelPosition.xy)) * 8.;
		
		
		modelPosition.z += sin((uTime * .02) + length(modelPosition.xy)) * 8.;


    vec4 modelPosition2 = modelMatrix * vec4(position, 1.);

   

    vec4 viewPosition = viewMatrix * modelPosition;
    vec4 projectionPosition = projectionMatrix * viewPosition;
  
    gl_Position = projectionPosition;
    

    
  gl_PointSize = (250. * 1.-(length(modelPosition.xy))) ;

    gl_PointSize *= (1.0/ -viewPosition.z);

    vUv = uv;
    pos = modelPosition.xyz;
		size = gl_PointSize;
              }
</script>

<script id="fragment" type="x-shader/x-fragment">
	uniform float uTime;

varying vec2 vUv;
uniform vec2 uResolution;
varying vec3 pos;
const float PI = 3.1415926535897932384626433832795;
varying float size;

  
vec2 rotate2D (vec2 _st, float _angle) {
    _st -= 0.5;
    _st =  mat2(cos(_angle),-sin(_angle),
                sin(_angle),cos(_angle)) * _st;
    _st += 0.5;
    return _st;

}

void coswarp(inout vec3 trip, float warpsScale ){

  trip.xyz += warpsScale * .1 * sin(3. * trip.yzx + (uTime * .15));
  trip.xyz += warpsScale * .05 * sin(uTime * trip.yzx + (uTime * .15));
  trip.xyz += warpsScale * .025 * sin(17. * trip.yzx + (uTime * .15));
  
}  

void uvRipple(inout vec2 uv, float intensity){

vec2 p = uv -.5;


  float cLength=length(p);

   uv= uv +(p/cLength)*cos(cLength*15.0-uTim.........完整代码请登录后点击上方下载按钮下载查看

网友评论0