• FEATURED

View more

View more

View more

### Image of the Day Submit

IOTD | Top Screenshots

### The latest, straight to your Inbox.

Subscribe to GameDev.net Direct to receive the latest updates and exclusive content.

# 2D in Opengl 3.2?

Old topic!

Guest, the last post of this topic is over 60 days old and at this point you may not reply in this topic. If you wish to continue this conversation start a new topic.

13 replies to this topic

### #1ElSuave  Members

Posted 24 May 2011 - 03:44 PM

Hello all

I was wondering if there is a simple way of doing 2D in the new OpenGL

Ive traveled the whole web for tutorials and all of these guys just keen on using screen coordinates for their purposes (-1,-1, 1,1)

Yes ofcourse one could think to start dividing all your coords by your screen space but that is not a clean way of doing it specially if you want to render worlds bigger than your screen
(In other words I dont want to have it that way on my project)

So if anybody in here could teach me step by step on how to do this I would be thankful

I already know how to create shader programs and all that stuff, the part that is really messing me up is;

- where to set up my coordinate system
- how to set it up

### #2V-man  Members

Posted 24 May 2011 - 04:37 PM

I suggest that you do what other games are doing. Make the usual orthographic projection matrix.
They usually call glOrtho(0.0, windowWidth, 0.0, windowHeight, znear, zfar)

Some people invert the y axis because they want it to go from top (0.0) to bottom (windowHeight) so you just swap your values
glOrtho(0.0, windowWidth, windowHeight, 0.0, znear, zfar)
Sig: http://glhlib.sourceforge.net
an open source GLU replacement library. Much more modern than GLU.
float matrix[16], inverse_matrix[16];
glhTranslatef2(matrix, 0.0, 0.0, 5.0);
glhScalef2(matrix, 1.0, 1.0, -1.0);
glhQuickInvertMatrixf2(matrix, inverse_matrix);
glUniformMatrix4fv(uniformLocation1, 1, FALSE, matrix);
glUniformMatrix4fv(uniformLocation2, 1, FALSE, inverse_matrix);

### #3ElSuave  Members

Posted 24 May 2011 - 05:13 PM

glOrtho? are you sure that works on 3.2?

### #4Brother Bob  Moderators

Posted 24 May 2011 - 05:20 PM

Replicate the functionality of it instead if you cannot use it. The point is not that you should use that particular function, but that you should use the projection is produces. Just create the corresponding matrix and load it into your shader if that's how you want to do it. The idea is still the same; use an orthographic projection, and create it using the parameters corresponding to the call V-man showed. Any decent documentation or reference manual will show you what the matrix from glOrtho looks like.

### #5PrestoChung  Members

Posted 24 May 2011 - 07:53 PM

You need to build an ortho projection matrix and get it to your shader as a uniform mat4.

You can either look up the what the function is on your own it is described here http://www.opengl.or...tml/glOrtho.xml but it looks like the syntax is kind of confusing.

An ortho projection function is available in the GLM library http://glm.g-truc.ne...cccf6eda05c8127

I haven't done any 2D games so I don't know how you want to handle your coordinates but I have used screen coordinates for my on-screen drawing with sampler2DRect in my fragment shader

### #6HolyDel  Members

Posted 25 May 2011 - 11:01 AM

code to build ortho matrix:

void Ortho(float *m, float left, float right, float top, float bottom, float znear, float zfar)
{
float tx = - (right + left) / (right - left);
float ty = - (top + bottom) / (top - bottom);
float tz = - (zfar + znear) / (zfar - znear);

Identity(m); //identity matrix

m[0] = 2.0f / (right - left);
m[12] = tx;
m[5] = 2 / (top - bottom);
m[13] = ty;
m[10] = -2 / (zfar - znear);
m[14] = tz;

return m;
}

axelynx: http://likosoft.com

### #7ElSuave  Members

Posted 26 May 2011 - 06:48 AM

Okay got my ortho matrix now what?

### #8DonceLT  Members

Posted 26 May 2011 - 07:04 AM

Okay got my ortho matrix now what?

Now draw everything with glVertex2f and so on.

### #9ElSuave  Members

Posted 26 May 2011 - 07:17 AM

what is that? Im using glDrawArrays to draw my geometry

Im trying to use the core profile

### #10Danny02  Members

Posted 26 May 2011 - 07:51 AM

in a shader u would transform your vertex positions as normal with the projection matrix.

also I would recomment NOT to use your screen size for creating your matrix. Just think about how many world-units the player should see in one direction and calculate the size of the other with your screen ratio.

for example you want the player to see 10 in width u have to set a height of 7.5 (ratio: 4/3), I think this is importandt because you wouldn't want the player to see more of the game depeding on their screen resolution.

Another thing I like to do is to set the center of the screen in the center of the projection, so instead of
ortho(0, 10, 0, 7.5 ...

I use
ortho(-5, 5, -3.75, 3.75 ...

### #11ElSuave  Members

Posted 26 May 2011 - 07:57 AM

in a shader u would transform your vertex positions as normal with the projection matrix.

also I would recomment NOT to use your screen size for creating your matrix. Just think about how many world-units the player should see in one direction and calculate the size of the other with your screen ratio.

for example you want the player to see 10 in width u have to set a height of 7.5 (ratio: 4/3), I think this is importandt because you wouldn't want the player to see more of the game depeding on their screen resolution.

Another thing I like to do is to set the center of the screen in the center of the projection, so instead of
ortho(0, 10, 0, 7.5 ...

I use
ortho(-5, 5, -3.75, 3.75 ...

Oh but Im doing 2D so I want to map vertices to pixel coordinates

with this I have no geometry being rendered (if I toggle the ortho projection it displays the polygon tho)

    GLint _uniform_location_matrix = -1;

glm::mat4 _projection(1.0f);
_projection = glm::ortho(0, 800, 600, 0, -100, 100);

CreateVBO();

glUniformMatrix4fv(_uniform_location_matrix, 1, GL_FALSE, glm::value_ptr(_projection));

while(true)Render();


#version 400

uniform mat4 mvpMatrix;

layout(location=0) in vec4 in_Position;
layout(location=1) in vec4 in_Color;
out vec4 ex_Color;

void main(void)
{
gl_Position = mvpMatrix * in_Position;
ex_Color = in_Color;
}


#version 400

in vec4 ex_Color;
out vec4 out_Color;

void main(void)
{
out_Color = ex_Color;
}


### #12Danny02  Members

Posted 26 May 2011 - 10:26 AM

why would u want to map vertices to single pixels?

just assume u would want to do some pixel art where textures have to align perfectly to pixels so u won't get flickering with gl_nearest.
In this case i would take care of this in the vertex shader. So you don't have to handle this View(Render) feature in your Controller(Game logic)

### #13ElSuave  Members

Posted 26 May 2011 - 11:07 AM

why would u want to map vertices to single pixels?

just assume u would want to do some pixel art where textures have to align perfectly to pixels so u won't get flickering with gl_nearest.
In this case i would take care of this in the vertex shader. So you don't have to handle this View(Render) feature in your Controller(Game logic)

I though I was doing just that :S

### #14Murdocki  Members

Posted 27 May 2011 - 06:18 AM

You could just fill a vertexbuffer with one quad (or more) like so:

	Vertex vertices[] =
{
{ Vector3f(), Vector2f(), }, //Top-left
{ Vector3f( (float)width, 0, 0 ),   Vector2f( 1.0f, 0.0f ), },  //Top-right
{ Vector3f( 0.0f, 		(float)height, 0.0f ),   Vector2f( 0.0f, 1.0f), }, //Bottom-left
{ Vector3f( (float)width, (float)height, 0.0f ), Vector2f( 1.0f, 1.0f), }, //Bottom-right
};


where Vertex would be three floats for position and two for uv. Texture coordinates are flipped on the y-axis here (DirectX convention).


uniform ivec2 ScreenSize;
uniform vec2 translation;
uniform vec2 scale = vec2( 1.0, 1.0 );
out vec2 texCoord;
void main()
{
vec4 vPos;
vPos.x = (gl_Vertex.x * scale.x + translation.x) / (ScreenSize.x/2.0f) - 1.0f;
vPos.y = 1.0f - (gl_Vertex.y * scale.y + translation.y) / (ScreenSize.y/2.0f);
vPos.z = 0.0f;
vPos.w = 1.0f;
gl_Position = vPos;
texCoord = vec2( gl_MultiTexCoord0.x, -gl_MultiTexCoord0.y ); //Flip back uv's y axis
}


This code is for OpenGL 2.1 so you might want to update it a bit but it gives the basic idea.

Old topic!

Guest, the last post of this topic is over 60 days old and at this point you may not reply in this topic. If you wish to continue this conversation start a new topic.