How to stop flipping the whole coordinates while using shader?

Hello community, beautiful rainy day :smiley:

I’m still learning how to deal with shader and all the openGL system.

I wrote a simple shader program to explain this.

The image is mapped good on the plane, but the center(0,0,0) goes always to the upper left corner of the screen.

I know it comes from the openGL coordinate system, but there might be a function to keep the previous coordinate system, even if I use something like ofEasyCam which switches the coord system by default.
(without ofScale() or touching the vertex shader)

I remember I saw a topic in this forum with an answer about this,
but couldn’t remember any right searching keyword to find that answer again, as it was months ago…

ofApp::setup()

img.load("image.png");
shader.load("shader");
plane.set(width, height, 10, 10);
plane.mapTexCoordsFromTexture(img.getTexture());

ofApp::draw()

shader.begin();
shader.setUniformTexture("testImage", img.getTexture(), 0);
plane.draw();
shader.end();

shader.frag

#version 150
uniform sampler2DRect testImage;

in vec2 texCoordVarying;
out vec4 outputColor;

void main()
{
    vec4 tex = texture(wood, texCoordVarying);
    outputColor = tex;
}

Hope you all an amazing day
Thank you

In openframeworks, by default, the text coord of a texture are defined like this:

the top left corner is 0 0, and 600x500 (or whatever your rectangle dimension are), is the bottom right. This system of coordinates is called ARB texture coordinate system, and it was implemented by the openFrameworks developers to keep consistency with the drawing coordinate system of openFrameworks(and Processing), where the top letf corner is 0, 0.

If you are going to write your own shader with this coordinate system, you have to use, sampler2DRect as in this example:

uniform sampler2DRect tex0;

out vec4 color;

void main(){

vec4 color = texture(tex0, texCoordVarying);

}

While in your ofApp.cpp, you have something like this:

be sure, in your setup method, to call:

//setup
image.load("test.jpg");
plane.set(400, 500, 2, 2);
plane.mapTexCoordsFromTexture(image.getTexture());

//draw
myShader.begin();
myShader.setUniformTexture("tex0",image.getTexture(), 0);
plane.draw();
myShader.end();

But in the openGL coordinate system 0,0 refers to the bottom left corner, and 1, 1 to the top right corner. If you want to use this coordinate system, you have to call ofDisableArbText() before your image get allocated.

Once you call this, in your custom shader, you can use:

uniform sampler2D tex0;

vec4 color0 = texture(tex0, texCoordVarying);

You can use ofEnableArbTex() and ofDisableArbTex() to switch between the two modes; just keep in mind that, if you want to use 0-1 coords with a specific texture, you’ll need to call ofDisableArbTex() before allocating it.

1 Like