Java-Gaming.org
 Featured games (90) games approved by the League of Dukes Games in Showcase (556) games submitted by our members Games in WIP (476) games currently in development
 News: Read the Java Gaming Resources, or peek at the official Java tutorials
Pages: [1]
 ignore  |  Print
 LWJGL Tutorial Series - Introduction to 3D  (Read 3200 times) 0 Members and 1 Guest are viewing this topic.
SHC
 « Posted 2013-09-11 09:39:48 »

# LWJGL Tutorial Series - Introduction to 3D

Welcome to the ninth part of the LWJGL tutorial series. In this tutorial we will learn how to setup three dimensional world in LWJGL and finally draw a pyramid which is rotating on it's y-axis. So before we actually start 3D rendering, let's start with understanding the 3D coordinate system. If you have found any mistakes or have some corrections, please notify them to me with comments.

# 3D Coordinate System

The 3D coordinate system is something we need to understand and since it's best understood with graphics, here is a visual representation of it.

You maybe familiar with it with the 3D math in school but I'll explain the basic again. First, we need to know what the axes represent so lets see that.

The X-axis represents the horizontal positions, Y-axis represents the vertical positions and the z-axis represents the depth information. So incrementing the x-component moves the model to the right and decreasing it moves the model to the left. Incrementing the y-component positions it at heights and decreasing the y-component moves a point down. Most confuse with the z-axis. The z-component value increases when the point is nearer to the eye and decreases when it moves forward into the screen. Now that we've understood the 3D coordinate system, let's now configure opengl to use this 3D coordinate system.

# Configuring 3D in OpenGL

Now that we're ready to configure, let me show the code that configures opengl to our 3D coordinate system.

 1  2  3  4  5  6  7  8  9 `glMatrixMode(GL_PROJECTION);glOrtho(-1, 1, -1, 1, 1, -1);glMatrixMode(GL_MODELVIEW);glLoadIdentity();glViewport(0, 0, Display.getWidth(), Display.getHeight());glEnable(GL_DEPTH_TEST);`

There is nothing special in here except the
 `glOrtho`
method which sets the left most point to -1, right most to 1, topmost to 1 and bottom most to -1. The zFar and zNear parameters represent the distance until which the objects are rendered. We always keep zNear to one since there is no point in drawing objects that are behind the screen. To be able to keep a draw distance of 10 which is almost sufficient to view a big world, we assign the zFar to -10. We also enabled depth testing since we are dealing with 3D Just don't forget to clear depth buffer every frame along with the color buffer. This can be done with

 1 `glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);`

Now that we've setup the OpenGL, it's time to render some 3D object. Since we must work with lots of triangles in the future tutorials, let's now render a pyramid onto the scene with four triangles.

# Creating a Pyramid

Since we're now familiar with VBOs, I leave the part of creation and rendering of VBOs to you. What I say is how to construct three dimensional vertices. Don't forget how the coordinate system's axes are defined. Now we make the front face of the pyramid. I'm showing you a visual pyramid model and it's vertices of the front face. The pyramid is rotated in the visual to clearly show how the z-axis coordinates are constructed.

In this way, all the vertices are constructed. I'm listing the supplying of vertices here. You have to create a vbo for colors on your own.

 1  2  3  4  5  6  7  8  9  10  11  12  13  14  15  16  17  18  19  20  21  22 `vertexBuffer.put(new float[]{    // Front face    +0.0f, +0.5f, +0.0f,    -0.5f, -0.5f, +0.5f,    +0.5f, -0.5f, +0.5f,    // Right face    +0.0f, +0.5f, +0.0f,    +0.5f, -0.5f, +0.5f,    +0.5f, -0.5f, -0.5f,    // Back face    +0.0f, +0.5f, +0.0f,    +0.5f, -0.5f, -0.5f,    -0.5f, -0.5f, -0.5f,    // Left face    +0.0f, +0.5f, +0.0f,    -0.5f, -0.5f, -0.5f,    -0.5f, -0.5f, +0.5f});`

This may take some time to understand the vertices, but there is nothing to explain them since you can easily construct them once you've got used to the coordinate system which is taught at high school level and I've already explained it. Don't forget to dispose the vbos you create before exiting the application. Also make sure you allocate the correct size for the buffers which is
 `3 * 12`
since now there are three axes and we define 12 vertices for the 4 triangles. Now running it will show you a triangle. Hey! Where do the other sides go? Don't worry, they are behind the first face. How can we see them? For that we need to rotate our pyramid.

# Rotating the Pyramid

To rotate our model, we take the help of our friend, the
 `glRotatef`
method. I've already covered this in the third part, Moving and Rotating Triangle. We now know how to rotate but on which axis should we rotate? Let's now see how rotation works on the different axes with some nice graphics.

Rotation on the X-Axis:

Rotating a model on its x-axis rotates it vertically. This is because the x-axis line passing through it's center is not being changed but the other axes are changed.

 1 `glRotatef(1, 1, 0, 0);`

Rotation on the Y-Axis:

Rotating a model on its y-axis rotates it horizontally since the y-axis remains unchanged and the other axes will be transformed.

 1 `glRotatef(1, 0, 1, 0);`

Rotation on the Z-Axis:

Similarly rotating a model on its z-axis appears like the object is actually a rotating 2D object since when z-axis do not change, we cannot see it's depth.

 1 `glRotatef(1, 0, 0, 1);`

See how different rotations affect our model? For this example, we are going to rotate on the y-axis. Now running the program creates a pyramid which rotates on it's y-axis.

That's the end of this tutorial and in the next part, let's know how to create a spinning cube with triangles. If there are any mistakes in this tutorial, please notify them to me with comments.

# Source Code

Tutorial9.java

davedes
 « Reply #1 - Posted 2013-09-11 16:10:46 »

Technically this is 2D since you are using orthographic projection..

http://en.wikipedia.org/wiki/Orthographic_projection

Keenly awaiting the programmable pipeline tutorials... !

SHC
 « Reply #2 - Posted 2013-09-11 16:44:36 »

Technically any game will be 2D since the vertices should be transformed to screen coordinates in order to display.

quew8

JGO Coder

Medals: 23

 « Reply #3 - Posted 2013-09-11 19:51:17 »

Orthographic projection does not make it 2D. A perspective projection gives you naturalistic 3D, but their are loads of times when you don't want it to be so. Think CAD, modelling programs or even a non-naturalistic style game.

Now, onto the tutorial. I thought the colour scheme you chose for your pyramid mightily confusing. Maybe solid coloured faces would be more easily understood. That's just my opinion.

Also you didn't mention that people had to clear their depth buffer as well as the colour buffer now they're using depth test. That was the first mistake I ever made in OpenGL. I couldn't figure it out and it put me off learning OpenGL for a month. Don't let others repeat my folly.
SHC
 « Reply #4 - Posted 2013-09-12 04:33:52 »

@quew8

I've cleared the depth buffer in code but just forgot to mention it in tutorial. Thanks for pointing that out. And for the perspective projection, how can I do that? Is it with
 `gluPerspective`
function or should I create a new camera class?

quew8

JGO Coder

Medals: 23

 « Reply #5 - Posted 2013-09-12 16:45:24 »

Firstly, I don't think there's anything wrong with starting off with orthographic projections for beginners, 3D or not.

You can use gluPerspective() or glFrustum(), they both do the same thing, just describe it in different ways. Technically, glFrustum() allows you more control since you can create off-centre perspectives. (As in the perspective is at an angle to the forward vector).  However I've never heard of this being used nor thought up any use for it (if anyone reading this does know, I'd like to hear them) so I think they're both equally good.

These pictures are probably all the info you need:

which are from the red book.

If you're getting weird results, my advice is to make the near value smaller although it should never be less than or equal to 0.
SHC
 « Reply #6 - Posted 2013-09-13 04:48:21 »

@quew8

Those images are really nice. I've understood glFructum but I'm having a problem with gluPerspective. I don't understand
 `fovy`
in it's diagram. I know that it's field of view but most tutorials I've seen doesn't explain what it is actually is. Some keep that value with 40f, 70f, 0f, 90f like that and there is no standard. Can you explain it to me?

quew8

JGO Coder

Medals: 23

 « Reply #7 - Posted 2013-09-13 18:30:00 »

Wow, that makes a change. Most people don't understand glFrustum(). FOV is an angle (I think gluPerspective takes it in degrees) which specifies "how much" you can see. Hard thing to explain. Mathematically: If you imagine a line from the centre of the projection (probably the wrong term - the camera in the diagrams) to the centre of the top of the near plane, and another from the centre to the centre of the bottom of the near plane, then the angle between them is fovy. But that's just what the diagram shows.

If you put your arms straight out in front of you and look straight ahead. Then start moving them left and right respectively at equal rates whilst keeping your head straight forward. Then you begin to look like an idiot. Keep moving them left and right until you can't see them anymore. Now keep your arms in the same place and look at them. The angle between them is the horizontal FOV of your eyes (as opposed to gluPerspective() which uses a vertical FOV for some reason). Its a bit more complex than that since you have two eyes and the image is magicked together by that hyper-intelligent brain of yours, but that is the general idea.

If you want to try it out and have access to a copy of Minecraft, then I believe that lets you mess around with the (horizontal) field of view. Most games don't, understandably since that actually effects game play. Why Minecraft does I don't know.

Anyway, judging from how small the scroll bar is, I waffled a little. Sorry.
SHC
 « Reply #8 - Posted 2013-09-14 09:06:35 »

@quew8

Thanks for that explanation. I didn't understand what you said but I got it with sproinge's explanation he gave on my other thread. I understood it and in my next tutorial which I will write in the evening, I'm going to explain both the methods and I'm going to use glFrustum for the example and for the future tutorials.

Pages: [1]
 ignore  |  Print

You cannot reply to this message, because it is very, very old.

 Add your game by posting it in the WIP section, or publish it in Showcase. The first screenshot will be displayed as a thumbnail.
 digdugdiggy (16 views) 2014-03-14 23:54:44 Rayvolution (26 views) 2014-03-13 00:02:00 The Lion King (50 views) 2014-03-11 04:35:53 Screem (70 views) 2014-03-08 05:04:17 Screem (73 views) 2014-03-08 05:01:59 Gibbo3771 (84 views) 2014-03-05 15:13:19 Conzar (84 views) 2014-03-05 09:59:23 Conzar (78 views) 2014-03-05 09:57:20 GamerIDGoesHere (111 views) 2014-03-02 10:31:15 GamerIDGoesHere (98 views) 2014-03-02 10:30:27
 opiop65 29x kpars 24x Rayvolution 21x HeroesGraveDev 20x BurntPizza 20x Grunnt 17x theagentd 15x jonjava 15x saucymeatman 15x Riven 14x LiquidNitrogen 13x revers 13x reymantha 13x Gibbo3771 11x princec 10x Troubleshoots 10x
 Anonymous/Local/Inner class gotchasby Roquen2014-03-11 15:22:30Anonymous/Local/Inner class gotchasby Roquen2014-03-11 15:05:20Anonymous/Local/Inner class gotchasby Roquen2014-03-10 14:19:36HotSpot Optionsby Roquen2014-02-26 17:00:23HotSpot Optionsby Roquen2014-02-26 11:27:03HotSpot Optionsby Dxu19942014-02-18 01:05:35HotSpot Options2014-02-16 03:47:31Mainby Roquen2014-02-10 11:17:06
 java-gaming.org is not responsible for the content posted by its members, including references to external websites, and other references that may or may not have a relation with our primarily gaming and game production oriented community. inquiries and complaints can be sent via email to the info‑account of the company managing the website of java‑gaming.org