Sign in to follow this  
adriansnetlis

Color Curve in a 2D GLSL Filter

Recommended Posts

# version 120
 
uniform sampler2D bgl_RenderedTexture;
 
float interp(float xa[6], float ya[6], float x){
    float xi = 0.0;
    int i = 0;
    for(int ii=0; ii<6; ii ++){
        float xix = xa[ii];
        if (xix >= x){
            xi = xix;
            i = ii;
            break;
        }
    }
    float x_min = xa[i-1];
    float y_min = ya[i-1];
    float y_max = ya[i];
    float factor = (x - x_min) / (xi - x_min);
    return y_min + (y_max - y_min) * factor;
}
 
float x_array[6] = float[6](0.0, 0.35, 0.46, 0.53, 0.7, 1.0);
float y_array[6] = float[6](0.0, 0.41, 0.52, 0.52, 0.64, 1.0);
    
void main(void)
{
    vec4 color = texture2D(bgl_RenderedTexture, gl_TexCoord[0].st);
    float xc = interp(x_array, y_array, color.x);
    float yc = interp(x_array, y_array, color.y);
    float zc = interp(x_array, y_array, color.z);
    color = vec4(xc, yc, zc, 1.0);
    
    gl_FragColor = color.rgba;
}

Share this post


Link to post
Share on other sites

# version 120
 
uniform sampler2D bgl_RenderedTexture;
 
float interp(float xa[4], float ya[4], float x){
    float xi = 0.0;
    int i = 0;
    for(int ii=0; ii<6; ii ++){
        float xix = xa[ii];
        if (xix >= x){
            xi = xix;
            i = ii;
            break;
        }
    }
    float x_min = xa[i-1];
    float y_min = ya[i-1];
    float y_max = ya[i];
    float factor = smoothstep(x_min, xi, x);
    return y_min + (y_max - y_min) * factor;
}
 
float x_array[4] = float[4](0.0, 0.49, 0.53, 1.0);
float y_array[4] = float[4](0.0, 0.4, 0.6, 1.0);
    
void main(void)
{
    vec4 color = texture2D(bgl_RenderedTexture, gl_TexCoord[0].st);
    float xc = interp(x_array, y_array, color.x);
    float yc = interp(x_array, y_array, color.y);
    float zc = interp(x_array, y_array, color.z);
    color = vec4(xc, yc, zc, 1.0);
    
    gl_FragColor = color.rgba;
}

Share this post


Link to post
Share on other sites

How does it work?

 

You did not say what you mean with "it". If you mean "How does the smoothstep function work?", the answer can be found on https://en.wikipedia.org/wiki/Smoothstep and https://www.opengl.org/sdk/docs/man/html/smoothstep.xhtml

 

Or you could create the color gradient with a painting program and load it as a texture. That would allow for more complex gradients with less math operations.

Share this post


Link to post
Share on other sites

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