Altaire software Organisation

 

 Home

 

 Join Altaire Soft Org

 

 Open-gl tutorials

 

 MUI (Micro User

 interface)

 

 Downloads

 

 Links

 

 The Webmaster

 

 

 

 

 

Open-gl tutorial for Win32 application with GLUT - December 25th, 2000 2:49 AM

 

 

 

 

For the ease of learning open-gl, the requirements for going thorough this tutorial are being listed: 

 

1,  Microsoft Visual C++ 6.0  (Older version can be used but there might be some incompatibility) 

2,  Some basic knowledge at C or C++ high level language

3,  Windows 95, 98, ME, NT or 2K operating system

4,  Adobe Photoshop (preferable as it is for creating textures)

5,  Microsoft paint

6,  GLUT (GL utility toolkits) version 3.6 or higher. For installation and setup, please refers to the later section in this tutorial.

 

 

So what is open-gl?

 

Some of you who might know me in personal might be wondering why I keep on hyping about Open-gl? And my wonder what is open-gl... Well, I think we might need to go through the history a bit in order to start the tutorial.

 

"OpenGL is strictly defined as a software interface to graphics hardware" by Richard S.Wright, Jr. Well, what is this mean to you. OpenGL is a library (eg, For those who has some knowledge about c or c++ language, it is something like iostream.h, math.h ... ). OpenGL is a library for creating 3D graphics and modeling that is extremely portable and fast. Well, open-gl program can be run cross wide range of platform such as Mircosoft's windows family, Macintosh's Mac OS, Sun OS, Beos, Linux ... OpenGL uses algorithms that are carefully developed and optimized by Sillicon Graphics, Inc. (SGI), an acknowledged world leader in computer graphics and animation. 

 

You might wonder what open-gl means to you in everyday life? Well, I bet you had at least watch one of those latest cartoon by Disney such as Bug's Life, Toy's Story... well those are some of the indirect example of the involvement of open-gl. For gamers, Soldier of fortune, Quake series, Counter strike, homeworld are some of the games that uses open-gl to develop those eye candy 3D graphics.

 

Actually OpenGL is not just for entertainments. It is also widely used in the development of those 3D military application, space exploration system, 3D map, weather forecast system or system to view those tiny little substances such as atom, molecule and ions... Flight training simulation system and virtual reality system also uses Open-gl to in their application to deliver high quality 3D graphics to the user.

 

Open-gl let's programmer to create 3D graphics by allowing them to talk with open-gl via high level languages which in turn the open-gl will do its part by talking to the computer hardware such as graphics card or accelerator to display 2D/3D images. So, Open-gl is act as the middleman (or more technically API) between the programmer and computer peripherals. In order to create those eye candy graphics, we need to learn how to talk with open-gl instead of leaning how to talk with the hardware itself. It save the programmers a great deal of effort and time as they are not require to write those low level language such as assembly language to display a graphics on screen.

 

 

The tutorials

 

The tutorials will cover two major sections in open-gl. They are the hardware and software. The hardware section will explained the various 3D graphics accelerator on the market and the various features offer by those accelerator. It will also explain the functionality of those boards and some basic knowledge in computer graphics. It would be a mixture of everything since I don't have any formal courses in computer graphics as all the knowledge is gain from various sources.

 

The software section will touch the actual programming of open-gl with coding and examples. The codes might not be up to par but it would definitely provide some starting steps for beginners. 

 

 

Introduction in computer graphics

 

Ok, in order to accelerate our learning process, I will skip the history for computer graphics as it would be very boring and monotonous to do so. These jargons and information are very useful throughout your life of computing. I will try to make this section like a FAQ section.

 

 

1, What is computer graphics?

Well there are whole lot bunch of definitions out there but for me it is a graphics stored in digital format that can be display, manipulate and stored in digital form. Yeah I know this is pretty lame... just skip it

 

 

2, What is color format?

Color format is a rules used to defined the color in digital form on a computer. There are various format available out there like RGB, RGBA, Grayscale, Duotone, CMYK, indexed color and others.

 

 

3, What is RGB color format?

RGB is an abbreviation of Red, Green and Blue. It is a color format that describe a computer image in three color format. In this format, red, green and blue are used to describe a pixel on screen (pixel is the smallest element in display, just assume it as the smallest dot you seen on the computer monitor. Put your eyes really close to the monitor and you can see the monitor's display is composed of hundred thousands of those tiny little dots, just assume it as pixel although the term pixel is defined in another way). 

 

RGB color format is sometimes know as 24bit color display since 8 bits or 1 byte is used for each channel of color. In this case, 8 bits for red, 8 bits for green and 8 bits for blue. In real word, this would rather be theoretical since windows operating system would use the 24 bits to store other information to describe the pixel on screen. In order to avoid further confusion, I would not explain this in detail. Anyway, the 8 bits data per channel enable a color to have a combination of 2 ^ 8 = 256 (255 in open-gl since 0 is also considered as a color). Thus, RGB has a combination of 256 * 256 * 256 (You do the calculation).

 

 

4, What is RGBA color format?

RGBA is an abbreviation of Red, Green, Blue and Alpha. This format is actually same as RGB format but it has an extra channel to describe the alpha (opaque) of the pixel. RGBA uses 32 bit to describe a pixel since 8 bits are dedicated to each channel,  8 bits for red, 8 bits for green, 8 bits for blue and 8 bits for alpha channel. In short RGBA provide more vibrant and detail color compared with RGB format. The 32bit color setting in the display properties in windows operating system is an example of 32bit color format. RGBA is widely used in those graphics workstation as it is a de facto for professional computer graphics editing system.

 

 

5, What is duotone color format?

Duotone color format is probably the most ancient color format in computing history. It is widely used in the early age of computing for display text. This format, if not mistaken, only requires 1 bit of data to describe a pixel. So the pixel would be either black or white in color.

 

 

6, What is CMYK color format?

CMYK is an abbreviation of Cyan, Magenta, Yellow and blacK. This color format also uses 32 bit of data to describe a pixel on screen and it is often used in the implementation on printer. 

 

7, what is grayscale color format?

Grayscale color format uses 8 bits to describe the color range from white to black (white <-> grey <-> black). This gives this color format a combination of 2 ^ 8 = 256 to describe the color from 0 (black) to 255 (white).

 

8, Some basic calculation in computer graphics

So here comes the mathematic part. Let's start from an example, let's say your desktop resolution is set to 800 pixels * 600 pixels (800 pixels width and 600 pixels height) in the system properties (right click on the desktop and choose properties, resolution = 800*600, color = 32 bit), then the amount of data involved in describing the screen is, 

 

1 pixel requires 32 bit of information or equivalent to 4 bytes of data as,

32 / 8 =  4

 

the amount of pixels involved in describing the screen would be,

800 pixels width * 600 pixels height = 480,000 pixels

 

Since 4 bytes are required per pixel, then 480,000 pixels would require

480,000 * 4 = 1,920,000 bytes of data

 

or equal to 1,920,000 / 1024 = 1,875KB 

or equal to 1,875 / 1024 = 1.8310546875 MB

 

9, Human perceptions of motion

Graphics motions, in my opinion, is defined as a series of different or non-different static images. My crappy English really hurt... A series of images (or known as frame, frame is a unit to quantify image) are used to create an illusion of motion. For television, the electron tube inside the machine is programmed to rescan the phosphorus (please revise your good ole physics book for detail information) approximately 27 times to 30 times per second so it would create an illusion of motion to the viewer. The same principle works on computer graphics except the computer counterpart would rescan (another jargons for rescan is "refresh", and the rate of rescan is "refresh rate" which is generally 60Hz, 72Hz, 75Hz, 80Hz, 85Hz, 100Hz or higher) as low as 60 times per second to create an illusion of motion. This is due to the interlaced (Please refers back to the introduction of computing textbook in semester 1) nature of television which only requires 30 rescan to produce a fluid motion. The computer monitor which is non-interlaced required at least 60 rescan to produce fluid motion. For more information, please drop me a mail as I won't spending a whole paragraph to explain this phenomenal.

 

Ok, let's come back to the theme, human eyes requires at least 30 frame per seconds or 30 refresh per second to create an illusion of fluid motion. Anything lower that that rate would create an unrealistic motion. There have been some arguments that human eyes can even detect movement at 1/100th second (a jet fighter pilot able to see and define the type of jet coming from an opposite direction in high speed movement). By the time, you start to create motion with open-gl, you should always keep in mind to optimized the program so it would at least display 30 fps (frame per seconds) on the targeted platform.

 

Again for more detail, please drop me a mail since explaining this section would consume me a lot of time.

 

10, Frames per second (fps)

Frame per second is a measurement to calculate the how many images are drawn per second to create a fluid motion illusion to viewer. FPS has also been a consistent measures of video performance of a particular computer system or graphics card (the term graphics card, display card, video card and 3D accelerator are use interchangeable in the context of this tutorial). It is generally a pretty good watermark, and it's quite suitable for comparing one piece of hardware to another. If card A gets 65 frames per second and card B gets 54, we know that card A is 20% faster. 

 

 

11, What are graphics file format such as .bmp, .jgp, .gif, .raw, .tiff, .psd means?

 

Images in computer are stored in digital form. Hence, there exist few graphics file format to store those digital information so they can be later display on the computer screen. Different graphics file format has their own unique way of storing graphics data. Graphics file format such as .bmp or know as bitmap file contains a header in the starting point of the file. The header contain of the information about the color format used, width and height of the image file and other information. 

 

Raw format (.raw) is another graphics format that store the graphics data without any header in between. You can try to save a image file under adobe Photoshop and the very next time you open the file, you will be prompt to provide the information about the color format, height and width of the image file because as mentioned before, Raw format does not contain a header. 

 

JPEG or known as Joint Picture Expert Group provide .jpg file format to store image in a loss information compression format. JPEG is a popular format to store image to display it on the internet.

 

Tiff format are quite popular in open-gl as it has a high compression ratio and suitable to use for textures. .psd is the propriety of ADOBE, it is used in Photoshop to store Photoshop files. 

 

Knowing the nature of a graphics file format is very important as it is required to create a library to load those images stored in those file formats to become textures (a image stick on a polygon) on a polygon.

 

12, What is a 3D card? 

So what is a 3D card? You might have heard about 3D accelerator in the past few years... name and brand like voodoo 5, GeForce 2, ATI Radeon can be heard from all those hardcore gamers. So what are the benefits offer by these boards? As known, open-gl is a open sourced graphics library. The basic idea of this library is to create 2d/3d computer images, animations and others. 

 

You might ask why we must or should choose open-gl instead of those free library on the net or instead write a graphics library by ourselves. Well, one of the underlying reasons is that open-gl, for most of the cases, is faster than other similar solution out there. There are two factors that contribute to the speed of open-gl, one is algorithms effectiveness and another is hardware support. Open-gl is carefully written by those software engineers and programmer at silicon graphics incorporated to ensure the open-gl to be the fastest library out there. 

 

Another factors is that open-gl is accelerated by hardware or computer peripherals like 3D accelerators and special instructions within the CPU (eg, MMX, SEE, 3DNow!, SEE2, KNI). The 3D accelerators or normally known as 3D card are the main factors in this process. In general, a computer equipped with a fancy CPU like Pentium 3 1GHz or else would perform badly in 3D rendering process if they are not equipped with a proper 3D card. Although the CPU itself is very fast in nature, but it is not designed to do graphics tasks such as rasterization (will be discussed later). 

 

In order for you to understand what actually a 3D card do, I will explain the process of getting a 3D graphics drawn on screen. I would use a cone as an example to explain the process. There are four stages in rendering a 3D images on screen under open-gl. First, it is the open-gl command buffer, the second one is transformation and lightning, the third one is rasterisation and the last one is frame buffer. Open-gl buffer is a buffer or dedicated memory area to receive open-gl commands and functions. This task is normally done by the CPU to convert all those command into low level instructions.

 

The second stage is the transformation and lightning. So what is transformation? Transformation is the process of moving the point or vertex (corner of a polygon). The red dots in the figure below are the vertexes for the cube.

 Vertexes are the basic elements for the cube since the cube is formed by joining those line together among the vertexes. Since the coordinates of those vertexes are store in a matrix form which consists of the X-axis value, Y-axis value and Z-axis value, they can undergo a series of mathematic equations to manipulate the cube (e.g. rotation, mirror, enlarge...). Those workstation class computer often equipped with a powerful 3D card that can accelerate the transformation process through a triangle setup processor on board. 

 

Consumer level of 3D accelerators, however, are bit late compared with workstation class graphics card as the T&L (transformation and lightning) engine or known as triangle setup processor is only offer in the latest generation of graphics card. Up to now, there are only NVIDIA Corp's GeForce SDR, GeForce DDR, GeForce 2 MX, GeForce 2 Go!, GeForce 2 GTS, GeForce 2 PRO, GeForce 2 Ultra, ATI Corp's RADEON (or known as rage 6c) and S3 Savage 2000 (very lousy) offer triangle setup processor on board to accelerate the transformation process. Other graphics board like TNT, TNT2, voodoo family chipsets do not offer triangle setup processor. 

 

For my opinion, this triangle setup processor is very useful since chipset like GeForce 2 can process 25 millions polygon per seconds. On a typical processor, it can only process a maximum of 3 millions polygon per seconds. It might be impressive on the paper. In real world benchmark, my lousy K6-2 500 with 3dnow! can only pump out 370,000 polygons per second while the GeForce 2 MX I have can pump up to 2,970,000 polygons per seconds. It is obvious, the triangle setup processor is almost 7-8 times faster than the CPU in doing those transformation. 

 

Another important thing in this stage is the lightning. Lightning is the process of adding light on the texture or polygon created on the screen. Lightning is a pretty CPU intensive process since it involved the process of calculating the normal point of the surface of a polygon. For example a rectangular has four vertexes, then the CPU need to find the cross product of the four vertexes and calculate the normal from the cross value. A graphics accelerator like the one I mentioned above would accelerate up to 8 light sources in a scene. That would relief the workload of the CPU and hence achieve the goal of getting over 30fps for motion fluid.

 

Consumer level of 3D accelerator chipset (according to timeframe)

 

1st generation

Voodoo 1

Riva 128

ATI Rage Pro

Premedia 1

voodoo rush

Rendetion Verite V1100

 

1.5 generation

Intel i740

 

2nd generation

Voodoo 2

ATI Rage 128

ATI 3D Rage Pro

Savage 3D

Matrox G200

Rendetion Verite V2200

 

2.5 generation

Voodoo banshee

Riva TNT

Premedia 2

PowerVR 2

Savage 4

Riva TNT 2 M64

Riva TNT 2 Vanta

 

3rd generation

Voodoo 3

Riva TNT 2

Riva TNT 2 PRO

Riva TNT 2 Ultra

Premedia 3

Intel i810

Intel i815

 

3.5 generation

Matrox G400

 

4th generation

GeForce 256 SDR - support T&L acceleration

GeForce 256 DDR - support T&L acceleration

Savage 2000 - support T&L acceleration

Voodoo 4

 

5th generation

GeForce 2 MX - support T&L acceleration

GeForce 2 GTS - support T&L acceleration

GeForce 2 Pro - support T&L acceleration

GeForce 2 Ultra - support T&L acceleration

ATI Radeon SDR - support T&L acceleration

ATI Radeon DDR - support T&L acceleration

Voodoo 5

Kryo PowerVR 3