Demo:WebGL Vox Demo

截图:

顶点着色器glsl es2.0代码:

precision highp float;
attribute vec3 a_vtx_pos;
attribute vec2 a_vtx_uv;
varying highp vec2 v_texUV;
uniform mediump vec2 u_Stage_size;
uniform vec3 a_time;
varying vec3 v_time;
void main()
{
    float px = 0.5 * u_Stage_size.x;
    float py = 0.5 * u_Stage_size.y;
    float kw = (2.0/u_Stage_size.x);
    float kh = (2.0/u_Stage_size.y);
    gl_Position = vec4((px + a_vtx_pos.x)* kw - 1.0, (py + a_vtx_pos.y) * kh - 1.0,0.0,1.0);
    v_texUV = a_vtx_uv;
    v_time = a_time;
}

片段着色器glsl es2.0代码:


precision highp float;
const float MATH_PI = 3.1415926;
const float MATH_2PI = 2.0 * MATH_PI;
const float MATH_1PER2PI = 0.5 * MATH_PI;
const float MATH_3PER2PI = 3.0 * MATH_PI * 0.5;
uniform sampler2D uSampler;
varying highp vec2 v_texUV;
varying vec3 v_time;
float getRadianByXY(float dx,float dy)
{
    if(abs(dx) < 0.00001)
    {
        if(dy >= 0.0) return MATH_1PER2PI;
        else return MATH_3PER2PI;
    }
    float rad = atan(dy/dx);
    if(dx >= 0.0)
    {
        return rad;
    }
    rad = MATH_PI + rad;
    return rad;
}
float getMinRadian(float a0, float a1)
{
    a0 = mod(a0,MATH_2PI);
    a1 = mod(a1,MATH_2PI);
    if (a0 < a1)
    {
    	a0 = MATH_2PI - a1 + a0;
    	if (a0 > MATH_PI) return a0 - MATH_2PI;
    	return a0;
    }
    else if (a0 > a1)
    {
    	a1 = MATH_2PI - a0 + a1;
    	if (a1 > MATH_PI) return MATH_2PI - a1;
    	return -a1;
    }
    return 0.0;
}
void main()
{
    float sRad = v_time.z;
    vec2 center = vec2(0.5,0.5);
    vec2 puv = vec2(v_texUV.x - center.x,v_texUV.y - center.y) * 2.0;
    float currRad = getRadianByXY(puv.x,puv.y);
    vec4 color = texture2D(uSampler, v_texUV).rgba;
    vec4 scolor = color;
    float len = 0.0;
    float k = getMinRadian(currRad,sRad);
    vec3 rgbK;
    if(k > 0.0)
    {
        k = k/3.14;
        k *= k;
        len = length(puv);
        if(k > 1.1)k = 1.1;
        rgbK = vec3(1.0);
    }
    else
    {
        k = abs(k)/3.14;
        k = pow(k,200.0);
        if(k > 1.1)k = 1.1;
        len = length(puv);
        rgbK = vec3(1.0,0.0,1.0);
    }
    len = (1.0 - len);
    color.rgb = color.rgb * len * k * rgbK.rgb + 0.2 * scolor.gbr * len;
    gl_FragColor = color.rgba;
}

更多推荐