webgl实现粒子宇宙效果代码-html代码-BFW代码库

webgl实现粒子宇宙效果代码

代码语言：html

所属分类：粒子

代码描述：webgl实现粒子宇宙效果代码

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


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

<head>

  <meta charset="UTF-8">

  
  
  
<style>
html,body {
  background-color: black;
  text-align: center;
}
</style>



</head>

<body >
  <canvas id="display"></canvas>

<!-- vshader is where the magic happens !-->
<script id="vshader" type="gles/vshader">
precision mediump float;

attribute vec2 Vertex;
uniform float Time;

varying vec4 Color;

float voronoi(in vec2 uv) {
    vec2 lp = abs(uv)*10.;
    vec2 sp = fract(lp)-.5;
    lp = floor(lp);
    
    float d = 1.;
    
    for (int x = -1; x < 2; x++) {
        for (int y = -1; y < 2; y++) {
            
            vec2 mp = vec2(float(x),float(y));
            vec2 p = lp+mp;
            
            d = min(d,length(sp+((cos(p.x)+cos(p.y))*5.)*.3-mp));
            
        }
    }
    
    return d;
}

void main() {
gl_PointSize = 1.;

   vec2 v = Vertex;
   
   float ang = atan(v.y,v.x);
   float len = length(v);

   v = v*mod(Time+len,1.)+vec2(sin(ang+voronoi(v.yx)),cos(ang+voronoi(v.xy)))*.3;
  v = v*.75 + v*.25*mat2(sin(ang+cos(Vertex.y*23.435+Time)),cos(ang+cos(Vertex.x*23.234)),-cos(ang),sin(ang));


   Color = mix(vec4(0.2,0.4,1.,(cos(ang)*.3+.6)*.03),
               vec4(1.,.7,0.4,(cos(len*24.)*.5+.5)*.02),
               cos(atan(v.y,v.x)*3.+ang+len)*.5+.5);
 
   gl_Position = vec4(v - vec2(0.,0.),0.,1.);


}
</script>

<script id="fshader" type="gles/pshader">
precision mediump float;

varying vec4 Color;
void main() {
gl_FragColor = Color;
}
</script>

  
      <script>
//This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License.
//by Ethan Shulman

var width = 640;
var height = 480;
var nump = 600000;
var timeScale = 1.0;
var alphablend = false;

var vbuf;
var pstart;

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