Sign in to follow this  

GLSL ripple effect

This topic is 2405 days old which is more than the 365 day threshold we allow for new replies. Please post a new topic.

If you intended to correct an error in the post then please contact us.

Recommended Posts

Hi,
I want a 2d water ripple effect. I tried to implement it using GLSL and the way it look is as shown in the image thats attached. At present its a static effect.
But i want the ripple effect to be interactive, ie when the mouse is clicked the ripple should get generated.

I got the shader ripple effect from http://www.geeks3d.com/20110316/shader-library-simple-2d-effects-sphere-and-ripple-in-glsl/

I am not getting an idea, how to implement it, like:

1) After getting the mouse position, what needs to be calculated. Since the background shown is a .BMP image.
2) What information and data needs to be changed in shder.vert and shder.frag files.

If someone can suggest some idea, it would be very helpful.

All suggestion are welcome.

Share this post


Link to post
Share on other sites
It looks like that effect calculates a shifted texture coordinate based on the fragments distance from the origin of texture coordinate space. So if you want it to be based off of a different point (i.e. where the mouse clicks) then you need to set an offset in a constant register (or whatever it is called in GLSL) and subtract that from the texture coordinate before finding the length vector.

You could additionally add a time value to your constant register that would define how long ago the point was clicked. Then you just need to use that time value to modify how much of the displacement is used.

Share this post


Link to post
Share on other sites
[quote name='Jason Z' timestamp='1305474303' post='4811104']
It looks like that effect calculates a shifted texture coordinate based on the fragments distance from the origin of texture coordinate space. So if you want it to be based off of a different point (i.e. where the mouse clicks) then you need to set an offset in a constant register (or whatever it is called in GLSL) and subtract that from the texture coordinate before finding the length vector.

You could additionally add a time value to your constant register that would define how long ago the point was clicked. Then you just need to use that time value to modify how much of the displacement is used.
[/quote]

Thanks for the reply.But can it be more elaborate, as if what in particular is needed.

ripple.vert file code is:
[code]
void main()
{
gl_TexCoord[0] = gl_MultiTexCoord0;
gl_Position = ftransform();
}

[/code]

we get the uniform variable
[code]
texCord = glGetUniformLocation(shaderProgram, "resolution");
[/code]

We get the mouse position like this
[code]
case GLUT_LEFT_BUTTON:
if(state == GLUT_DOWN) {
lastX = x;
lastY = y;
GLfloat val[2];
val[0] = x;
val[1] = y;
glUseProgram(shaderProgram);
glUniform1fv(texCord, 2, val); //<----------------------
[/code]


ripple.frag file code is :
[code]
uniform vec2 resolution; // Screen resolution
uniform float time; // time in seconds
uniform sampler2D tex0; // scene buffer
void main(void)
{
vec2 tc = resolution - gl_TexCoord[0].xy; // Is it this change <-----------------------
vec2 p = -1.0 + 2.0 * tc;
float len = length(p);
vec2 uv = tc + (p/len)*cos(len*12.0-time*4.0)*0.03;
vec3 col = texture2D(tex0,uv).xyz;
gl_FragColor = vec4(col,1.0);
}
[/code]

Some suggestion regarding where the changes is required will be helpful.

Share this post


Link to post
Share on other sites

This topic is 2405 days old which is more than the 365 day threshold we allow for new replies. Please post a new topic.

If you intended to correct an error in the post then please contact us.

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this