Quantcast
Channel: GLSL / Shaders - Processing 2.x and 3.x Forum
Viewing all 212 articles
Browse latest View live

Passing struct to shader

$
0
0

Hi,

Currently I'm passing an array of floats to my shader, but I'd like to pass in more complex items. From my research it seems like I'd use structs here but Java does not support them.

My object is something like this:

struct boid { vec2 position; vec2 velocity; int flock; }

Any advice on how to build an equivalent object in my Processing code to pass in?


Convert Shader from Shadertoy.com for Processing

$
0
0

Hi all,

Seeing how efficient shaders are at applying an effect to video frames, is there a way to convert any shader from Shadertoy to work in processing?

Thanks, Charles

Shader doesn't compile

$
0
0

this fragment shader always fails to compile, irrespective of what I try. Why???

#ifdef GL_ES
precision mediump float;
#endif

uniform vec2 resolution;
uniform sampler2D ppixels;

uniform float DA;
uniform float DB;
uniform float feed;
uniform float kill;
uniform float dt;

void main (void) {
    vec2 position = ( gl_FragCoord.xy / resolution.xy );
    vec2 pixel = 1./resolution;

    float A = texture2D(ppixels, position).r;

    float sumA = -A;

    sumA += 0.05*texture2D(ppixels, position + pixel * vec2(-1., -1.)).r;
    sumA += 0.05*texture2D(ppixels, position + pixel * vec2(-1., 1.)).r;
    sumA += 0.05*texture2D(ppixels, position + pixel * vec2(1., -1.)).r;
    sumA += 0.05*texture2D(ppixels, position + pixel * vec2(1., 1.)).r;
    sumA += 0.2*texture2D(ppixels, position + pixel * vec2(1., 0.)).r;
    sumA += 0.2*texture2D(ppixels, position + pixel * vec2(-1., 0.)).r;
    sumA += 0.2*texture2D(ppixels, position + pixel * vec2(0., -1.)).r;
    sumA += 0.2*texture2D(ppixels, position + pixel * vec2(0., 1.)).r;


    float B = texture2D(ppixels, position).g;
    float sumB = -B;
    sumB += 0.05*texture2D(ppixels, position + pixel * vec2(-1., -1.)).g;
    sumB += 0.05*texture2D(ppixels, position + pixel * vec2(-1., 1.)).g;
    sumB += 0.05*texture2D(ppixels, position + pixel * vec2(1., -1.)).g;
    sumB += 0.05*texture2D(ppixels, position + pixel * vec2(1., 1.)).g;
    sumB += 0.2*texture2D(ppixels, position + pixel * vec2(1., 0.)).g;
    sumB += 0.2*texture2D(ppixels, position + pixel * vec2(-1., 0.)).g;
    sumB += 0.2*texture2D(ppixels, position + pixel * vec2(0., -1.)).g;
    sumB += 0.2*texture2D(ppixels, position + pixel * vec2(0., 1.)).g

    float nA = A + ((DA*sumA) - (A*B*B) + (feed*(1.0 - A)))*dt;
    float nB = B + ((DB*sumB) + (A*B*B) - ((kill + feed)*B))*dt;


    gl_FragColor = vec4(nA, nB, 0.0, 1.0);
}

The code I use is this -

PShader algorithm;
PGraphics pg;

public static final float DA = 1;
public static final float DB = 0.5;
public static final float feed = 0.055;
public static final float kill = 0.062;
public static final float dt = 1;

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

  algorithm = loadShader("algorithm.glsl");

  pg = createGraphics(width, height, P2D);
  pg.noSmooth();

  pg.beginDraw();
  pg.fill(255, 255, 0);
  pg.noStroke();
  pg.background(255, 0, 0);
  pg.rect(width/2 - 10, height/2 - 10, 20, 20);
  pg.endDraw();

  algorithm.set("resolution", float(pg.width), float(pg.height));
  algorithm.set("DA", DA);
  algorithm.set("DB", DB);
  algorithm.set("feed", feed);
  algorithm.set("kill", kill);
  algorithm.set("dt", dt);
}
void draw() {
  pg.beginDraw();
  //pg.background(0);
  pg.shader(algorithm);
  pg.rect(0, 0, pg.width, pg.height);
  pg.endDraw();
  image(pg, 0, 0, width, height);
}

Reaction-Diffusion using GLSL works different from normal

$
0
0

I managed to get Reaction Diffusion Algorithm to run on the GPU, but now I'm having problems. The code runs and all, but the effect is much different from the effect I get with Reaction Diffusion Algorithm on the CPU. Why?

Code for shader based Reaction-Diffusion -

PDE file -

PShader algorithm, pass;
PGraphics pg;

public static final float DA = 1.0;
public static final float DB = 0.5;
public static final float feed = 0.055;
public static final float kill = 0.062;
public static final float dt = 1.0;

public static final float min = 0.48;
public static final float max = 0.52;

public static final int N_PASS = 10;

boolean first = true;

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

  algorithm = loadShader("algorithm.frag");
  pass = loadShader("pass.frag");

  pg = createGraphics(width, height, P2D);
  pg.noSmooth();

  algorithm.set("resolution", float(pg.width), float(pg.height));
  algorithm.set("DA", DA);
  algorithm.set("DB", DB);
  algorithm.set("feed", feed);
  algorithm.set("kill", kill);
  algorithm.set("dt", dt);
  algorithm.set("min", min);
  algorithm.set("max", max);
}
void draw() {
  algorithm.set("first", first);
  first = false;
  for(int i = 0; i < N_PASS; i++){
    pg.beginDraw();
    pg.background(0);
    pg.shader(algorithm);
    pg.rect(0, 0, pg.width, pg.height);
    pg.endDraw();
  }
  shader(pass);
  image(pg, 0, 0);
  if(frameCount%30 == 0)println(frameRate);//forget this
}

algortihm.frag -

#ifdef GL_ES
precision mediump float;
#endif

uniform vec2 resolution;
uniform sampler2D ppixels;

uniform float DA;
uniform float DB;
uniform float feed;
uniform float kill;
uniform float dt;
uniform float min;
uniform float max;

uniform bool first;

void main (void) {
    vec2 position = ( gl_FragCoord.xy / resolution.xy );
    vec2 pixel = 1.0/resolution;

    if(first){
        if(position.x > min && position.x < max && position.y > min && position.y < max){
            gl_FragColor = vec4(1.0, 1.0, 0.0, 1.0);
        }else{
            gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0);
        }
    }else{
        float A = texture(ppixels, position).r;

        float sumA = -A;

        sumA += 0.05*texture(ppixels, position + pixel * vec2(-1.0, -1.0)).r;
        sumA += 0.05*texture(ppixels, position + pixel * vec2(-1.0, 1.0)).r;
        sumA += 0.05*texture(ppixels, position + pixel * vec2(1.0, -1.0)).r;
        sumA += 0.05*texture(ppixels, position + pixel * vec2(1.0, 1.0)).r;
        sumA += 0.2*texture(ppixels, position + pixel * vec2(1.0, 0.0)).r;
        sumA += 0.2*texture(ppixels, position + pixel * vec2(-1.0, 0.0)).r;
        sumA += 0.2*texture(ppixels, position + pixel * vec2(0.0, -1.0)).r;
        sumA += 0.2*texture(ppixels, position + pixel * vec2(0.0, 1.0)).r;


        float B = texture(ppixels, position).g;
        float sumB = -B;
        sumB += 0.05*texture(ppixels, position + pixel * vec2(-1.0, -1.0)).g;
        sumB += 0.05*texture(ppixels, position + pixel * vec2(-1.0, 1.0)).g;
        sumB += 0.05*texture(ppixels, position + pixel * vec2(1.0, -1.0)).g;
        sumB += 0.05*texture(ppixels, position + pixel * vec2(1.0, 1.0)).g;
        sumB += 0.2*texture(ppixels, position + pixel * vec2(1.0, 0.0)).g;
        sumB += 0.2*texture(ppixels, position + pixel * vec2(-1.0, 0.0)).g;
        sumB += 0.2*texture(ppixels, position + pixel * vec2(0.0, -1.0)).g;
        sumB += 0.2*texture(ppixels, position + pixel * vec2(0.0, 1.0)).g;

        float nA = A + ((DA*sumA) - (A*B)*B + (feed*(1.0 - A)))*dt;
        float nB = B + ((DB*sumB) + (A*B)*B - ((kill + feed)*B))*dt;


        gl_FragColor = vec4(clamp(nA, 0.0, 1.0), clamp(nB, 0.0, 1.0), 0.0, 1.0);
    }
}

pass.frag -

uniform sampler2D texture;
varying vec4 vertTexCoord;

void main(){
    vec4 inColor = texture2D(texture, vertTexCoord.st);
    gl_FragColor = vec4(1.0 - inColor.g, 1.0 - inColor.g, 1.0 - inColor.g, 1.0);
}

Image Texture Mode strange Mapping

$
0
0

I tested this code with other frameworks/engines It works fine.

In processing with different images/videos etc. you can see a line going through the screen

I guess, it's the default texture mode. Maybe a user already got a workaround

Any help is much appreciated.

//Vertex
String[] vertSource={"#if __VERSION__ >= 150" //check backward compatible /mobile
  , "#define attribute in"
  , "#define varying out"
  , "#endif"
  , "#ifdef GL_ES"
  , "precision mediump float;"
  , "precision mediump int;"
  , "#endif"

  //attribute
  , "in vec4 position;"
  //uniforms
  , "uniform mat3 Ry;"
  , "uniform float pitch;"
  //varying
  , "out vec3 refDir;"

  , "void main() {"
  , "gl_Position = vec4(position.xy,0, 1.);"

  //apply Rotation Matix
  , "refDir = Ry*vec4(position.xy,1.,0).xyz;"
  , "}"
};

//Fragment
String[] fragSource={"#if __VERSION__ >= 150" //check backward compatible /mobile
  , "#define attribute in"
  , "#define varying out"
  , "#endif"
  , "#ifdef GL_ES"
  , "precision mediump float;"
  , "precision mediump int;"
  , "#endif"

  //attribute
  , "in vec3 refDir;"
  //uniforms
  , "uniform sampler2D envmap;"
  //varying
  , "out vec4 fragColor;"

  , "#define PI 3.14159273"

  , "void main () {"

  //map texture to sphere: https://github.com/mrdoob/three.js/issues/1621
  , "float lat = atan(refDir.z,refDir.x);"
  , "float lon = acos(refDir.y/length(refDir));"
  , "fragColor = texture(envmap,vec2(.5+lat/(2.0*PI),lon/PI));"
  , "}"
};

PShader shader;
PImage img;
PMatrix3D rotY = new PMatrix3D();

void setup() {
  //setup scene
  size(640, 360, P3D);

  //load frag/vert Source
  shader=new PShader(this, vertSource, fragSource);

  //load equirectangular Image
  //https://www.flickr.com/search/?l=commderiv&q=equirectangular
  img = loadImage("https://c1.staticflickr.com/8/7178/7019373941_c1f2402f06_h.jpg");
}
void draw() {

  //map mouse to a range form - to
  float p=map(mouseX, 0, width, HALF_PI, -PI);
  //rotation to mouse
  float s=sin(p), c=cos(p);

  //uniform Rotation Matrix
  shader.set("Ry", rotY, true);

  //reset to NULL
  rotY.reset();
  //Rotation (pitch) http://planning.cs.uiuc.edu/node102.html
  rotY.apply(
  c, 0, s, 0,
  0, 1, 0, 0,
  -s, 0, c, 0,
  0, 0, 0, 1);

  //clear
  background(0);

  //uniform texture image
  shader.set("envmap", img);

  //apply filter to scene
  filter(shader);
}

eqi-img-processing

Chaining Shaders and Feedback

$
0
0

Hi,

I'm now here, so let me introduce myself.

I'm Alex, from sunny London, in the UK.

I'm new to Processing, but have some programming experience, in various languages. I've also used GLSL shaders quite a lot in Quartz Composer, but the particular job I'm working on at the moment seems difficult to achieve in QC, so I'm thinking of giving Processing a try, instead, which brings me to my questions:

  1. Is it possible to chain several 2D fragment shaders together, so that the result of one shader is passed into the next shader as a texture? My particular scenario involves a further complication:

  2. Is it possible to chain 2 shaders as above, and have the second shader feed back into the first, and also go through a third shader, which renders the result to the screen? I've attempted to illustrate what I have in mind below.

|| [shader 0] > [shader 1] || > [shader 2] > [screen] || || === < [prev. frame] < ===

I'm aware this is kinda throwing myself in at the deep end, but any advice would be much appreciated.

Thanks guys,

a|x

Shadron Support Lib or Convert ?

$
0
0

Hello everyone!

I have a suggestion / problem to share with you. I use from time to time a software that name Shadron. And I once wanted to load a GLSL shader file with this extension. Of course, it does not work! Can someone create a library to allow the use of this extension? Being relatively beginner and not having the nessaisary knowledge to create it I allow myself to make this requirement. Or is there a posilibilty fairly simple way to convert it. Knowing that it looks and is based on GLSL! I did not contact the developer. But I will inform him of my message here. Just after ! Maybe he can bring a solution?

Creating a bubble displacement effect

$
0
0

Just implemented a voronoi frag shader, really happy with the results, and now I'm working on using it to displace a video. I'd like to displace it with the voronoi cell point as the center, to make a kind of voronoi bubble effect, but I can't seem to get the math just right to make the distortion radiate from the point in a realistic way. Does anyone have some tips?

Here is what I have so far:

uniform sampler2DRect tex0;

varying vec2 texcoord0;

uniform float strength;

uniform float time;
uniform float scale;
uniform float speed;
uniform vec2 dim;

uniform float rand_seed;

float rand(vec2 co){
    return fract(sin(dot(co.xy ,vec2(12.9898,78.233))) * 43758.5453);
}

void main()
{
    vec2 st = vec2(gl_FragCoord.xy/dim.xy);
    st.x *= dim.x/dim.y;
    vec2 displacement = vec2(1.);

    st *= scale;

    vec2 i_st = floor(st);
    vec2 f_st = fract(st);

    float m_dist = 1.;
    vec2 m_point;

    for(int y = -1; y <= 1; y++){
        for(int x = -1; x <= 1; x++){
            vec2 neighbor = vec2(float(x),float(y));
            vec2 point = vec2(rand((i_st + neighbor)*rand_seed));

            point = 0.5 + 0.5*sin((time/speed) + 6.2831*point);

            vec2 diff = neighbor + point - f_st;

            float dist = length(diff);

            if(dist < m_dist){
                m_dist = dist;
                m_point = point;
            }
        }
    }

    //displacement vector
    //TODO: How can I conform this to the voronoi shape?
    //displacement = vec2(m_dist - m_point) - m_dist; //this is great, and a possible alt to the working voronoi
    displacement = m_dist * vec2(m_point - vec2(gl_FragCoord.xy/dim.xy));
    //can the vec2 come back negative?

    //isolines
    //color -= step(.7,abs(sin(100.0*m_dist)))*.3;

    //point dot
    //displacement -= 1.-step(.05, m_dist);


    vec2 uv0 = texcoord0 / dim;

    uv0.x += uv0.x * (displacement.x/strength);
    uv0.y += uv0.y * (displacement.y/strength);

    vec3 color = texture2DRect(tex0, uv0*dim).xyz;

    gl_FragColor = vec4(color,1.0);
}

Shader Talk

$
0
0

Sometimes i find functions and workarounds still valid dated back in Processing Forum v1.0

  • Here you can post everything you find interesting about Shaders, GLSL and Processing
    Lost &Found Github Repository, general Links, Tutorials

Center

A Debug Shader
Plug your formula in and see what happens next
//imagine a question mark behind every line

PShader shdr;

void setup() {
  size(640, 360, P2D);

  noStroke();
  rectMode(RADIUS);

  shdr=new PShader(this,
    new String[]{"#version 150 \n"
    + "in vec2 position;"
    + "void main() {"
    + "gl_Position = vec4(position.xy,0.,1.);"
   + "}"
    }, new String[]{"#version 150 \n"
      + "out vec4 fragColor;"
      + "uniform vec3 iResolution;"
      + "void main() {"
      + "vec2 uvv = (gl_FragCoord.xy*2.-iResolution.xy)/iResolution.z;"
      + "float cir=.2/length(uvv);"
      + "fragColor = vec4(vec3(cir),1.);"
     +"}"
    });

  shdr.set("iResolution", new PVector(width, height, Math.min(width, height)));

  shader(shdr);
}

void draw() {
  background(0);
  rect(0, 0, width, height);
}

Advanced OpenGL Example, Peasycam, ControlP5

$
0
0

Hi all!

I'm not quite sure how to frame this question- I'm a processing noob, but as usual, I've jumped in at the deep end, so I'm not sure whether the issue is something basic I'm failing to understand (quite likely).

I created a class to implement a VBO-based grid, taking the Advanced OpenGL example as a starting-point.

Now, I want to render the geometry in the main draw thread. I want to use Peasy Cam to be able to rotate/move the grid, and I want to be able to overlay ControlP5 items on top.

The issue is that the geometry created by an instance of my new class appears on top of the controls. Also, it rotates when I change the camera. I want it to always appear in front of the 3D geometry, and to not move when the camera is moved.

I'm attaching a zip of the work as it stands. I'd be really really grateful if someone could take a look at it, and if possible, give me some tips on where I'm going wrong. I'm sure it's something pretty simple.

Here's the file on Dropbox.

Regards,

a|x

How do I get depth data ?

$
0
0

I am to try out depth of field and I am first trying to get depth data with GLSL. I am able to generate DEPTH map but there are some glitches I don't understand why?Screen Shot 2017-06-01 at 7.04.55 PM above images shows a long box and it just shows hollow from front face.

this is processing code PShader depth; PGraphics pg; void setup() { size(600,600,P3D); depth = loadShader("frag.glsl","vert.glsl") ; pg= createGraphics(600,600,P3D); depth.set("far",100.0); } float t=0; void draw() { t+=0.001; pg.hint(ENABLE_DEPTH_TEST); pg.shader(depth); pg.beginDraw(); pg.noStroke(); pg.background(0); pg.translate(width/2+50,height/2,0); pg.rotateY(2*PI-PI*t/7); pg.box(20,20,1000); // pg.translate(-200,-100,0); pg.box(40,40,100); pg.endDraw(); image(pg,0,0); }

here is fragment shader: #ifdef GL_ES precision mediump float; precision mediump int; #endif

varying vec4 vertColor;
varying vec3 vertNormal;
varying vec3 vertLightDir;
varying float dist;

void main() {

    gl_FragColor = vec4(vec3(1.0,1.0,1.0)*1/clamp(dist,0,1000), 1.0 );

}

following is vertex shader: uniform mat4 transform; uniform mat3 normalMatrix; uniform vec3 lightNormal;

attribute vec4 position;
attribute vec4 color;
attribute vec3 normal;


uniform vec3 cameraPosition;
uniform float far;

varying vec4 vertColor;
varying vec3 vertNormal;
varying vec3 vertLightDir;
varying float dist;

void main() {


    vertNormal = normal;

    dist = (distance(cameraPosition,position.xyz)/far);

    gl_Position = transform *position;
}

what could be the issue? well I am just new to GLSL so please sorry for any simple mistake. Also if there is any simple way to do nice DoF let me know.

2D Raycast lighting/shadow shader

$
0
0

https://github.com/lmccandless/RaytraceShader

I made a pixel based 2D raycast lighting/shadow shader. It detects pixels with full red as walls, and can run over 500fps with 6 lights on my gtx 1070.

I have been playing with learning shaders and hacked away at the conway and blur examples and skimming the book of shaders to get to here. It works well, but it could clearly be better. It needs more natural mixing of the light, and probably could run faster. Could any shader/lighting gurus steer me in the right direction?

I widdled the code down to almost nothing and got it as clean as I could, it should be easy to dive into.

There doesn't seem to be any other examples of doing this in processing and I feel many people would find it useful, so I'd like to get it much more proper.

Advanced OpenGL: Point Size

$
0
0

I've been hacking on the Advanced OpenGL example sketch, trying to create a VBO-based grid that I can then apply GLSL shaders to, to do various cool things.

One of the things I want to do is add an option to display grid vertices as points. I've managed to get that working, but I can't work out how to change the point-size with an OpenGL call.

I'm currently using

gl.glDrawElements(PGL.POINTS, indices.length, GL.GL_UNSIGNED_INT, 0);

to draw the verts as points.

I'd like to add a line to change point-size, and maybe add the possibility of antialiasing them, too. I've tried various things, but haven't been able to get it to work.

a|x

3D objects and blendMode(ADD) causes artifacts

$
0
0

Screen Shot 2017-06-04 at 7.15.03 PM

code is simple I update blendMode(ADD ) in setup and draw sphere() I am going to use shader later but with out shader there is this problem.

void setup()
{
//....... other setup setup stuff
      blendMode(ADD);
}
int y=0;
void draw()
{
//  hint(ENABLE_DEPTH_TEST);
  noStroke();
  background(0);

  sh.set("mainPower",2.7);
  sh.set("eyePos",0.0, 0.0, 100.0);
  //shader(sh);

  translate(width/2,height/2+y,0);
  fill(250,100,0);
  sphere(90);
  //box(30);
  if(y>height/2)
  y=-height/2;
  else
  y++;
}

Lot of shapes with a shader?

$
0
0

I have a for loop that I am running on the CPU to draw thousands of 2D circles per frame, using ellipse(). Could I pass the locations of all of these ellipses to a shader somehow and see a good performance increase?

It seems like this should be easy to do with a frag shader but I am pretty inexperienced and can't find any examples of doing anything similar in processing.

edit: I think the PixelFlow customParticles example has everything, just not very straightforward adapting it


GLSL shader does not reproduce

$
0
0

I am trying to make a new shader I have successfull(here it is ) made the visual I wanted in shaderFrog online shader tool. I also ported it to processing sketch but some thing is not write it does not create the same effect.

//code

` PShader blast; void setup() { size(700,700,P3D); blast=loadShader("blastfrag.glsl","blastvert.glsl");

}
float t=0;
float r=110.0; //just 10pixels  away from sphere to test brightness effect
void draw()
{
  t+=0.01;
  background(0);
  translate(width/2,height/2,0);
  blast.set("lightPosition",r*sin(t*10) , 10.0,60.0);

  shader(blast);
  noStroke();
  fill(255,20,20);

  sphere(100);
//box(600,600,1500);
}

`

my vert shader is

uniform mat4 transform;
uniform mat3 normalMatrix;
uniform mat4 texMatrix;
uniform mat4 modelview;

uniform vec3 lightPosition;

attribute vec4 position;
attribute vec4 color;
attribute vec3 normal;
attribute vec2 texCoord;

varying vec4 vertColor;
varying vec3 vNormal;
varying vec3 vPosition;
varying vec3 lightDir;
varying vec3 lpos;

void main() {
  vec3 LightPos   = vec3(0., 500., 0.);
  gl_Position = transform * position;
  vec4 mecPosition =  modelview * vec4(position.xyz,1.0);
  vPosition = mecPosition.xyz;
  vNormal =  normal;
  lightDir = normalize(lightPosition.xyz - vPosition);
  vertColor = color;
  lpos =lightPosition;
  //vertTexCoord = texMatrix * vec4(texCoord, 1.0, 1.0);
}

and fragment shader:

#ifdef GL_ES
precision mediump float;
precision mediump int;
#endif

varying vec4 vertColor;
varying vec3 ecNormal;
varying vec3 lightDir;

varying vec3 lpos;
varying vec3 vPosition;
uniform mat4 modelview;
uniform mat3 normalMatrix;
varying vec3 vNormal;

void main() {
  vec3 direction = normalize(lightDir);
  //vec3 normal = normalize(ecNormal);
  //float intensity = max(0.0, dot(direction, normal));
  //vec4 tintColor = vec4(intensity, intensity, intensity, 1) * vertColor;
  vec3 Normal =normalMatrix * vNormal;
  float dotNor =dot(direction,Normal);
  float attanuate =1.0/ (length(lpos-vPosition )+0.001);
//  vec3 lightVec = normalize(lpos-vPosition);


//*(4.0*dotNor*attanuate);

  gl_FragColor = vec4( vertColor.xyz *( 1.0 * dotNor* attanuate),1.0);
}

I guess I have messed you with matrix I don't understand them right now exactly. Some Questions are lightPositions already transformed? I really wanted to do attenuation from light distance there is some thing wrong there because if remove it from main equation things appear but not that highlighted surface. also you can see the original shader I wrote in shader frog. I want that highlight when light is close to surface. that burning white.Screen Shot 2017-06-07 at 3.21.53 PM

Screen Shot 2017-06-07 at 3.21.32 PM

Ripples shader demo

Advanced OpenGL Vertex Buffer Object

$
0
0

Hi,

has anyone tried using VAOs in Processing?

I'm attempting to add a VAO to the Advanced OpenGL example from the Wiki, but I can't work out how to set it up.

My plan is to create and populate the VBOs and bind them to a VAO in setup(), then I just need to bind and draw the VAO in draw(), rather than having to bind the 3 VBOs individually before drawing. That's the plan, anyway.

So far, I've changed 'gl' to be an instance of the 'GL3', rather than 'GL2ES2' JOGL objects, as I think VAOs aren't part of the GL2ES2 spec.

I've changed gl = pgl.gl.getGL2ES2(); to gl = pgl.gl.getGL3(); to match.

I've also generated an extra IntBuffer in setup()

gl.glGenBuffers(4, intBuffer); vaoId = intBuffer.get(0); posVboId = intBuffer.get(1); colorVboId = intBuffer.get(2); indexVboId = intBuffer.get(3);

as according to the the jogamp docs for GL3, the glGenVertexArrays() function requires an IntBuffer as its 2nd argument.

What I can't work out is what should be in the IntBuffer that's passed in, and how to get the data into it.

Apologies if this is a stupid question. I have a basic concept of what VAOs are for, but have never tried implementing them before.

Any tips or pointers gratefully accepted.

a|x

Shader Artist

$
0
0

I need help with glsl shaders, I need someone to teach me and or make a shader for me for a project. I need shaders like a phong reflection material, a big shader for shadows that support multiple lights and textures, and the one I failed to make, a outline shader, to render like a outline around a 3D shape.I'm also looking for a realistic sun light effect and a shader that can display bump maps Also really important I am working in 3D. If you are interested to help me contact me at stephcraft@videotron.ca or on my skype at Stephcraft64 :D

Interesting reference

https://forum.processing.org/two/discussion/12775/simple-shadow-mapping#latest

ppixels, feedback, and colors / determining the color at a location of texture

$
0
0

Trying to get a feedback system working with shaders, and as a first-step, was simply trying to get colours to swap on each draw call. I have this working, but if I try using the few lines in my shader that are commented out, things stop working:

EDIT: Looked at the Conway game of life example, and it makes sense. To rephrase the question then - -- can I draw some shapes and have that be the initial texture that the shader uses? How? -- and why am I able to invert colours with swizzle but not able to discern where the red pixels are with a step function / if statement?

PDE file:

PShader fragShader;
PGraphics pg;

void setup() {
  size(600,600,P2D);
  frameRate(1);

  fragShader = loadShader("diffusion.frag");
  fragShader.set("resolution", float(width), float(height));

  pg = createGraphics(width, height, P2D);
}


void draw() {

  pg.beginDraw();
    pg.fill(0);
    pg.rect(0,0,pg.width, pg.height);
    pg.noStroke();
    pg.fill(255, 0,0);
    pg.ellipse(300,300,150,150);
    pg.shader(fragShader);
    pg.rect(0, 0, pg.width, pg.height);
  pg.endDraw();

  image(pg, 0, 0);
}

SHADER:

#ifdef GL_ES
precision highp float;
precision mediump int;
#endif

uniform vec2 resolution;
uniform sampler2D ppixels;

vec2 psize = 1./resolution.xy;


void main() {
  vec2 st = gl_FragCoord.xy/resolution.xy;

  vec4 tc = texture(ppixels, st);

  //float isRed = step(0.9, tc.r);
  //vec3 col = isRed*vec3(0., 1., 0.) + (1.-isRed)*vec3(1.,0.,0.);


  // gl_FragColor = vec4(col, 1.);
  gl_FragColor = tc.grba;
}

The ellipse's red and green values swap succesfully with this. However, if I use the 3 commented-out lines instead, ie use the step function to calculate if the texture isRed, I lose the ellipse -- all the pixels seem to return 1.0 at the step function, so the entire screen flashes between red and green...

Tried using an if statement instead of step - but same result.

Any help would be much appreciated! Thank you!

Viewing all 212 articles
Browse latest View live