Daze Graffiti: 八月 2013

2013年8月28日星期三

[GLSL] 入門-4 翻轉影像

uniform sampler2D tex;
uniform vec2 flip;

void main(void){

 vec3 color=texture2D(tex,abs(flip-gl_TexCoord[0].xy)).rgb;
        //透過外部輸入的2維flip變數，重新排列影像pixel的順序。

 color += gl_TexCoord[0].x>0.99 ? 1.0:0.0;//右邊界畫白線
 color += gl_TexCoord[0].x<0.01 ? 1.0:0.0;//左邊界畫白線
 color += gl_TexCoord[0].y>0.985 ? 1.0:0.0;//上邊界畫白線
 color += gl_TexCoord[0].y<0.015 ? 1.0:0.0;//下邊界畫白線

   gl_FragColor=vec4(color,1.0);
}

這是一個翻轉影像的簡單練習，而gl_TexCoord[0].xy這材質座標，是用來讀取外部材質的索引依據（2維的陣列）

download

2013年8月26日星期一

[GLSL] 入門-3 把貼圖的材質當成陣列使用

uniform sampler2D tex;
uniform vec2 resolution;
uniform float chsize;

void main(void){
 vec2 uv = gl_FragCoord.xy / resolution.xy;
 vec2 center = gl_FragCoord.xy / resolution.xy * 2.0-1.0;
 
 float k = (gl_FragCoord.x+(gl_FragCoord.y*800.0))/(800.0*600.0);
 vec3 col=texture2D(tex,vec2(mod(mod(uv.x*chsize,1.0)*chsize,1.0) ,
               mod(mod(uv.y*chsize,1.0)*chsize,1.0) 
          )).rgb;
 float f=col.r;
  gl_FragColor = vec4(f,f,f,1.0);
}

這個練習到底要表達什麼，我也還說不清楚.. 總之大約就是想透過材質輸入的方式（把音訊訊號轉成灰階陣列圖），
來取代shader不能讀取外部陣列的困擾..然而目前這方式也還不算完全可行就是.. download

2013年8月23日星期五

[GLSL] 入門-2 透過glsl載入buffer影像

把影像存在buffer中，透過shader讀取不同的材質。

uniform sampler2D tex;
uniform vec2 resolution;
uniform int f;

void main (void)
{

 vec2 uv=gl_FragCoord.xy/resolution.xy;
 vec3 col= texture2D(tex, vec2(uv.x , 1.0-uv.y)).xyz;

 gl_FragColor = vec4( col, 1.0 );

}

file download

2013年8月6日星期二

[GLSL] 入門-1 矩陣圓球

[example 1] ↓

//沒有光暈的球
uniform vec2 resolution;
uniform float time;
vec2 uv;

vec2 circle(float i){ 
 return vec2(uv+vec2(fract(i/10.0)*2.0-0.9 ,
  fract(floor(i/10.0)/10.0)*2.0-0.9 ));
}


void main(void){
 uv = (gl_FragCoord.xy / resolution.xy)*2.0-1.0;
 float col;
 float k;

 for(float i=0.0;i<100 .0="" 1.0:0.0="" col="" gl_fragcolor="vec4(col,col,col,1.0);" i="" k="" pre="">

[example 2]

//有光暈的球
uniform vec2 resolution;
uniform float time;
vec2 uv;

vec2 circle(float i){ 
 return uv-vec2(fract(i/10.0)*2.0-0.9 ,fract(floor(i/10.0)/10.0)*2.0-0.9 );
}


void main(void){
 uv = (gl_FragCoord.xy / resolution.xy)*2.0-1.0;
 float col;
 float back=abs(time-0.5);

 for(float i=0.0;i<100 .0="" back="" circle="" col="" gl_fragcolor="vec4(col,col,col,1.0);" i="" length="" pow="" pre="">

example download