Compute Shaders in Processing

I do not think that you need compute shaders here because a simple fragment shader would do it for generating gradients. I have added you a simple example which currently uses RGB values to calculate the gradient. I leave it up to you to extend it with the lab conversion. But as a hint, check out this shadertoy example: https://www.shadertoy.com/view/wt23Rt

PShader gradientShader;
PGraphics canvas;

void setup() {
  size(500, 500, P2D);

  canvas = createGraphics(400, 400, P2D);

  gradientShader = createShader();
}

void draw() {
  background(55);

  gradientShader.set("resolution", canvas.width, canvas.height);
  gradientShader.set("startColor", 1.0, 0, 0); // red
  gradientShader.set("endColor", 0, 0, 1.0); // blue
  canvas.filter(gradientShader);

  imageMode(CENTER);
  image(canvas, width / 2, height / 2);
}

public PShader createShader() {
  String[] vert = new String[] {
    "#version 150", 

    "uniform mat4 transform;", 

    "in vec4 position;", 
    "in vec4 color;", 

    "out vec4 vertColor;", 

    "void main() {", 
    "  gl_Position = transform * position;", 
    "  vertColor = color;", 
    "}"
  };

  String[] frag = new String[] {
    "#version 150",

    "in vec4 vertColor;", 
    "out vec4 fragColor;", 
    
    "uniform vec2 resolution;",
    
    "uniform vec3 startColor;",
    "uniform vec3 endColor;",

    "void main() {",
    "  vec2 coordinates = gl_FragCoord.xy / resolution;",
    "  vec3 value = mix(startColor, endColor, coordinates.x);",
    "  fragColor = vec4(value.xyz, 1.0);",
    "}"
  };

  return new PShader(this, vert, frag);
}

Preview

1 Like