glsl

I'm trying to implement flat-shading in webgl, I knew that varying keyword in vertex shader will interpolation that value and pass it to fragment shader. I'm trying to disable interpolation, and I found that flat keyword can do this, but it seems cannot use in webgl? flat varying vec4 fragColor; always getting error: Illegal use of reserved word 'flat' BrunoLevy I think 'flat' is not supported by the version of GLSL used in WebGL. If you want flat shading, there are several options: 1) replicate the polygon's normal in each vertex. It is the simplest solution, but I find it a bit

How do I compute an eye space coordinate from window space (pixel in the frame buffer) coordinates + pixel depth value in GLSL please (gluUnproject in GLSL so to speak)? kvark Looks to be duplicate of GLSL convert gl_FragCoord.z into eye-space z . Edit (complete answer): // input: x_coord, y_coord, samplerDepth vec2 xy = vec2(x_coord,y_coord); //in [0,1] range vec4 v_screen = vec4(xy, texture(samplerDepth,xy), 1.0 ); vec4 v_homo = inverse(gl_ProjectionMatrix) * 2.0*(v_screen-vec4(0.5)); vec3 v_eye = v_homo.xyz / v_homo.w; //transfer from homogeneous coordinates Assuming you've stuck with a

I'm trying to achieve making a gradient color as the design apps (Photoshop for example) does, but can't get the exact result i want. My shader creates very nice 'gradients' but also contains other colors that are different from the colors I want to switch in. It looks nice but, my aim is adding blending functions later and make a kind of color correction shader. but first of all I have to get the right colors. Here is my fragment shader http://player.thebookofshaders.com/?log=171119111216 uniform vec2 u_resolution; void main() { vec2 st = gl_FragCoord.xy/u_resolution.xy; vec3 color1 = vec3(1

I'm trying to implement the paper "Single-Pass Wireframe Rendering", which seems pretty simple, but it's giving me what I'd expect as far as thick, dark values. The paper didn't give the exact code to figure out the altitudes, so I did it as I thought fit. The code should project the three vertices into viewport space, get their "altitudes" and send them to the fragment shader. The fragment shader determines the distance of the closest edge and generates an edgeIntensity. I'm not sure what I'm supposed to do with this value, but since it's supposed to scale between [0,1], I multiply the

I'm aiming for this effect: (horizontal-only contour lines): I did find this example , however it creates horizontal and vertical contour lines. I can't quite wrap my head around how the call to fwidth() is generating the lines. uniform float gsize;//size of the grid uniform float gwidth;//grid lines'width in pixels varying vec3 P; void main() { vec3 f = abs(fract (P * gsize)-0.5); vec3 df = fwidth(P * gsize); float mi=max(0.0,gwidth-1.0), ma=max(1.0,gwidth);//should be uniforms vec3 g=clamp((f-df*mi)/(df*(ma-mi)),max(0.0,1.0-gwidth),1.0);//max(0.0,1.0-gwidth) should also be sent as uniform

I am writing a fragment shader in order to median 9 images together. I have never worked with GLSL before, but it seemed like the right tool for the job, as OpenCL isn't available on iOS and medianing on the CPU is inefficient. Here's what I have so far: uniform sampler2D frames[9]; uniform vec2 wh; void main(void) { vec4 sortedFrameValues[9]; float sortedGrayScaleValues[9]; for (int i = 0; i < 9; i++) { sortedFrameValues[i] = texture2D(frames[i], -gl_FragCoord.xy / wh); sortedGrayScaleValues[i] = dot(sortedFrameValues[i].xyz, vec3(0.299, 0.587, 0.114)); } // TODO: Sort sortedGrayScaleValues