HTML5 WebGL酷炫星云3D旋转动画特效免费下载

HTML5 WebGL酷炫星云3D旋转动画特效,非常的好看,鼠标按住页面拖动可以变化角度。

JS代码

<script id='vShader' type='x-vertex/x-shader'> 
  uniform float size; 
  uniform float t; 
  uniform float z; 
  uniform float pixelRatio; 
   
  varying vec3 vPosition; 
  varying vec3 mPosition;//modified position 
  varying float gas; 
   
  float a,b=0.; 
   
  void main(){ 
   
    vPosition=position; 
     
    a=length(position); 
    if(t>0.)b=max(0.,(cos(a/20.-t*.02)-.99)*3./a); 
    if(z>0.)b=max(0.,cos(a/40.-z*.01+2.)); 
    mPosition=position*(1.+b*4.); 
    vec4 mvPosition=modelViewMatrix*vec4(mPosition,1.); 
    gl_Position=mvPosition*projectionMatrix; 
     
    gas=max(.0,sin(-a/20.)); 
    gl_PointSize=pixelRatio*size*(1.+gas*2.)/length(mvPosition.xyz); 
   
  } 
</script> 
 
<script id='fShader' type='x-fragment/x-shader'> 
  uniform float z; 
       
  varying vec3 vPosition; 
  varying vec3 mPosition; 
  varying float gas; 
       
  void main(){ 
     
    float a=distance(mPosition,vPosition); 
    if(a>0.)a=1.; 
     
    float b=max(.32,.0065*length(vPosition)); 
       
    float c=distance(gl_PointCoord,vec2(.5)); 
    float starlook=-(c-.5)*1.2*gas;  
    float gaslook=(1.-gas)/(c*10.); 
    float texture=starlook+gaslook; 
                
    gl_FragColor=vec4(.32,.28,b,1.)*texture*(1.-a*.35); 
    if(z>0.)gl_FragColor*=cos(1.57*z/322.)*(1.-.001*length(mPosition)); 
       
  } 
</script> 
 
<script src="js/stat.js" defer="defer" async="async"></script> 
<script src='js/three.min.js'></script> 
<script src='js/TweenMax.min.js'></script>
恭喜,此资源为免费资源,请先
本站大部分下载资源收集于网络,只做学习和交流使用,版权归原作者所有! 若您需要使用非免费的软件、源码或服务,请购买正版授权并合法使用! 本站发布的内容若侵犯到您的权益,请联系站长删除,我们将及时处理! 本站所有资源均是收集而来,资源均不包含技术支持和安装服务!点击下载视为同意资源仅限学习使用。
打赏
下载价格:免费
下载说明:本站大部分下载资源收集于网络,只做学习和交流使用,版权归原作者所有! 若您需要使用非免费的软件、源码或服务,请购买正版授权并合法使用! 本站发布的内容若侵犯到您的权益,请联系站长删除,我们将及时处理! 本站所有资源均是收集而来,资源均不包含技术支持和安装服务!点击下载视为同意资源仅限学习使用。
0

评论0

请先

没有账号? 忘记密码?

社交账号快速登录