Computer Graphics

186
COMPUTER GRAPHICS Assoc. Prof. Dr. Mutlu AVCI Çukurova University Computer Engineering Department

Transcript of Computer Graphics

Page 1: Computer Graphics

COMPUTER GRAPHICS

Assoc. Prof. Dr. Mutlu AVCI

Çukurova University

Computer Engineering Department

Page 2: Computer Graphics

Contents

Lecture 1:• Introduction to OpenGL and OpenGLUT• DEVC++ development environment• Working window creation• Dot drawing in the window• Line drawing in the window• Dashed line drawing in the window• Coordinate system• Dashed line in the coordinate system

Page 3: Computer Graphics

Introduction

• What is OpenGL ?

- OpenGL is a software interface to graphics hardware.

- This interface consists of about 120 distinct commands, which you use to specify the objects and operations needed to produce interactive three-dimensional applications.

Page 4: Computer Graphics

• What are the requirements for OpenGL?– OpenGL is designed as a streamlined, hardware-

independent interface to be implemented on many different hardware platforms.

– To achieve these qualities, no commands for performing windowing tasks or obtaining user input are included in OpenGL; instead, you must work through whatever windowing system controls the particular hardware you're using.

Page 5: Computer Graphics

• What kind of objects are defined by OpenGL?– OpenGL doesn't provide high-level commands for

describing models of three-dimensional objects.

– Such commands might allow you to specify relatively complicated shapes such as automobiles, parts of the body, airplanes, or molecules.

– With OpenGL, you must build up your desired model from a small set of geometric primitives such as points, lines, and polygons.

Page 6: Computer Graphics

• Development of OpenGL– Silicon Graphics (SGI) revolutionized the

graphics workstation by implementing the pipeline in hardware (1982)

– To access the system, application programmers used a library called GL

– With GL, it was relatively simple to program three dimensional interactive applications

Page 7: Computer Graphics

– The success of GL lead to OpenGL (1992), a platform-independent API that was

- Easy to use- Close enough to the hardware to get

excellent performance- Focus on rendering- Omitted windowing and input to

avoid window system dependencies

Page 8: Computer Graphics

– Controlled by an Architectural Review Board (ARB) (http://www.opengl.org/developers/about/arb.html)

- Members include SGI, Microsoft, Nvidia, HP, 3DLabs, IBM,…….- Relatively stable (2.0 specification currently

out)- Evolution reflects new hardware capabilities- 3D texture mapping and texture objects- Vertex shaders!!!- Allows for platform specific features through

extensions

Page 9: Computer Graphics

• What are the OpenGL core and utility libraries?– OpenGL core libraries:

- OpenGL32 on Windows (opengl32.lib)- GL on most unix/linux systems

- OpenGL Utility Library (GLU) (glu32.lib)- Provides functionality in OpenGL core but avoids having to rewrite code (ie. spheres)

- Links with window system- GLX for X window systems- WGL for Windows (windows.h)- AGL for Macintosh

Page 10: Computer Graphics

• OpenGL Utility Library (GLUT) (glut32.lib)- Provides functionality common to all window systems- Open a window- Get input from mouse and keyboard- Menus- Event-driven- Code is portable but GLUT lacks the functionality of a good toolkit for a specific platform- Slide bars

Page 11: Computer Graphics

OpenGL Functions

• Primitives- Points- Line Segments- Polygons- curves and surfaces…

• Attributes• Transformations

- Viewing- Modeling

• Control• Input (GLUT)

Page 12: Computer Graphics

• OpenGL is a state machine• OpenGL functions are of two types

- Primitive generating: - Can cause output if primitive is visible- How vertices are processed and appearance of primitive are controlled by the state

- State changing: - Transformation functions – rotate, translate, scale.- Attribute functions – color, material

Page 13: Computer Graphics

• OpenGL is not object oriented so there are multiple functions for a given logical function

glVertex3fglVertex2iglVertex3dv

Easy to create overloaded functions in C++ but issue is efficiency

Page 14: Computer Graphics

OpenGL function format

Page 15: Computer Graphics

• Most constants are defined in the include files gl.h, glu.h and glut.h

• Note #include <glut.h> should automatically include the others

ExamplesglBegin(GL_POLYGON)glClear(GL_COLOR_BUFFER_BIT)

often used as switches for functions include files also define OpenGL data types:

Glfloat, Gldouble,….

Page 16: Computer Graphics
Page 17: Computer Graphics

OpenGL Programming Structure#include <GL/glut.h> // required GL Utility library inclusion

void mydisplay(){glClear(GL_COLOR_BUFFER_BIT);glBegin(GL_POLYGON);glVertex2f(-0.5, -0.5);glVertex2f(-0.5, 0.5);glVertex2f(0.5, 0.5);glVertex2f(0.5, -0.5);glEnd();glFlush();}int main(int argc, char** argv){glutCreateWindow("simple");glutDisplayFunc(mydisplay);glutMainLoop();}

This kind of subroutine parts contain drawing properties of the special objects

This main program part:-creates the window which will hold the drawings;-make adjustments of the window-displays objects in the window by calling subroutines-enters a loop to hold the view

Page 18: Computer Graphics

Question

• If we write and execute an OpenGl program as shown below what happens?

#include <GL/glut.h>main(int argc,char** argv) {glutInit(&argc,argv);glutCreateWindow("yeni");glutMainLoop();}

Page 19: Computer Graphics

Adjustments to overcome linker problems

Page 20: Computer Graphics

Question

• What about following codes?#include <GL/glut.h>void goruntu(void){glFlush();} main(int argc,char** argv) {glutInit(&argc,argv);glutCreateWindow("yeni");glutDisplayFunc(goruntu);glutMainLoop();}

Page 21: Computer Graphics

Question

• What happens if set window position?#include <GL/glut.h>void goruntu(void){glFlush();} main(int argc,char** argv) {glutInit(&argc,argv);glutInitWindowPosition(100,100);glutCreateWindow("yeni");glutDisplayFunc(goruntu);glutMainLoop();}

Page 22: Computer Graphics

Question

• How can we increase size of the window?#include <GL/glut.h>void goruntu(void){glFlush();} main(int argc,char** argv) {glutInit(&argc,argv);glutInitWindowPosition(100,100);glutInitWindowSize(800,800);glutCreateWindow("yeni");glutDisplayFunc(goruntu);glutMainLoop();}

Page 23: Computer Graphics

Question

• How can we clear the content of the window?#include <GL/glut.h>void goruntu(void){glClear(GL_COLOR_BUFFER_BIT);glFlush();} main(int argc,char** argv) {glutInit(&argc,argv);glutInitWindowPosition(100,100);glutInitWindowSize(800,800);glutCreateWindow("yeni");glutDisplayFunc(goruntu);glutMainLoop();}

Page 24: Computer Graphics

Question• If we want to have a window with red background how can we do this?#include <GL/glut.h>void goruntu(void){glClear(GL_COLOR_BUFFER_BIT);glFlush();} main(int argc,char** argv) {glutInit(&argc,argv);glutInitWindowPosition(100,100);glutInitWindowSize(800,800);glutCreateWindow("yeni");glClearColor(1.0,0.0,0.0,0.0);glutDisplayFunc(goruntu);glutMainLoop();}

Page 25: Computer Graphics

Question• What about green background?#include <GL/glut.h>void goruntu(void){glClear(GL_COLOR_BUFFER_BIT);glFlush();} main(int argc,char** argv) {glutInit(&argc,argv);glutInitWindowPosition(100,100);glutInitWindowSize(800,800);glutCreateWindow("yeni");glClearColor(0.0,1.0,0.0,0.0);glutDisplayFunc(goruntu);glutMainLoop();}

Page 26: Computer Graphics

Question• Blue one?#include <GL/glut.h>void goruntu(void){glClear(GL_COLOR_BUFFER_BIT);glFlush();} main(int argc,char** argv) {glutInit(&argc,argv);glutInitWindowPosition(100,100);glutInitWindowSize(800,800);glutCreateWindow("yeni");glClearColor(0.0,0.0,1.0,0.0);glutDisplayFunc(goruntu);glutMainLoop();}

Page 27: Computer Graphics

Analysis of Basic OpenGL Commands

• Let’s start with analysis of main( ) part of the program:

• glutInit(&argc, argv);

Initiation of the Glut routines. First parameter argc stands for adres of argument count and second parameter holds the argument values passing to glut routine.

Page 28: Computer Graphics

• glutInitDisplayMode(GLUT_SINGLE| GLUT_RGB);

Buffer dimension and Color type of the window is decided.

GLUT_SINGLE parameter shows single buffer memory is preferred. This selection is done for drawing modes. In animation case GLUT_DOUBLE is preffered.

Page 29: Computer Graphics

• Other parameters are:– GLUT_RGBA : a window with RGBA color

palette is chosen– GLUT_RGB : except with Alpha opaqueness

parameter a window with RGB color palette is chosen

– GLUT_INDEX : chooses color sequencing case– GLUT_ACCUM : chooses accumulating buffer

memory

Page 30: Computer Graphics

– GLUT_ALPHA : a window with Alpha parameter is chosen

– GLUT_DEPTH : a window with color deepness is chosen

i.e. If we would like to create a window with double buffer, RGBA color palette and color depth then our DisplayMode will be:

glutInitDisplayMode(GLUT_DOUBLE | GLUT_RGBA | GLUT_DEPTH)

Page 31: Computer Graphics

• glutInitWindowSize(double width, double length);

If we have 800x600 window resolution, then our maximum selection of the window size will be;

glutInitWindowSize(800, 600);

Page 32: Computer Graphics

• glutCreateWindow(“my first window”);

Creates a new window with my first window caption

Page 33: Computer Graphics

• glClearColor(R, G, B, A);

R Red, G Green, B Blue, A Alpha

Some color generations can be obtained as;

Page 34: Computer Graphics

Black 0.0 0.0 0.0

Red 1.0 0.0 0.0

Green 0.0 1.0 0.0

Blue 0.0 0.0 1.0

Brown 0.6 0.4 0.12

Purple 0.6 0.4 0.7

White 1.0 1.0 1.0

Page 35: Computer Graphics

• glutShadeModel(GL_FLAT);

This function decides the color domination approach of the object.

If GL_FLAT is used then single color will be dominant

If GL_SMOOTH is used then each corner of the object can have different color

Page 36: Computer Graphics

• glutDisplayFunc(goruntu);

This function is one of the most important one. It calls a predefined view of objects

All drawing actions are executed by this command

Page 37: Computer Graphics

• glClear(GL_COLOR_BUFFER_BIT);

It is time to start analysis of the subroutine

glClear(GL_COLOR_BUFFER_BIT);

This function clears the window by painting the color defined by the glClearColor( )

Without this command you can draw overlapping objects

Page 38: Computer Graphics

• glFlush( )

This command is used with single buffered window, it views the created object in the drawing window.

Page 39: Computer Graphics

• glutMainLoop( );

This is the infinite loop of the window also it takes into account the directives and commands to the window such as any key press from the user

Page 40: Computer Graphics

CREATING DOTs#include <GL/glut.h>

void nokta(void){

glClear(GL_COLOR_BUFFER_BIT);

glColor3f(0.0,0.0,1.0);

glPointSize(4.0);

glBegin(GL_POINTS);

glVertex2f(0.5,0.4);

glVertex2f(-0.5,0.4);

glEND( );

glFlush( );}

Page 41: Computer Graphics

int main(int argc,char** argv) {

glutInit(&argc,argv);

glutInitDisplayMode(GLUT_SINGLE|GLUT_RGB);

glutInitWindowPosition(0,0);

glutInitWindowSize(800,800);

glutCreateWindow(“dot example");

glClearColor(1.0,1.0,1.0,1.0);

glutDisplayFunc(nokta);

glutMainLoop();

return 0;}

Page 42: Computer Graphics
Page 43: Computer Graphics

• glColor3f(R,G,B);

Color adjustment for dot or surface.

• glPointSize(1.0);

Size adjustmet for the dot.

• glBegin(GL_POINTS);

Starts GL_POINTS directive

Page 44: Computer Graphics

• glVertex2f(x,y);

Gives vertex coordinates i.e. x=0.5, y=0.4

• glEnd( );

Shows the end of the drawing

Page 45: Computer Graphics

#include"gl/glut.h“

void gosterim(void){

glClear(GL_COLOR_BUFFER_BIT);

glColor3f(0.0,0.0,1.0);

glLineWidth(4.0);

glBegin(GL_LINES);

glVertex2f(0.5,0.4);

glVertex2f(-0.5,0.4);

glEnd();

glFlush();}

Line drawing

Page 46: Computer Graphics

int main(int argc,char ** argv){

glutInit(&argc,argv);

glutInitDisplayMode(GLUT_SINGLE | GLUT_RGB);

glutInitWindowPosition(0,0);

glutInitWindowSize(400,400);

glutCreateWindow("yeni");

glClearColor(1.0,1.0,1.0,1.0);

glShadeModel(GL_FLAT);

glutDisplayFunc(gosterim);

glutMainLoop();

return 0;}

Page 47: Computer Graphics

glLineWidth(4.0);

Adjusts width of the line between two points

Default line width is 1.0.

GL_LINES directive is used to draw line between two points

Page 48: Computer Graphics

Dashed line drawing#include"gl/glut.h“

void gosterim(void){

glClear(GL_COLOR_BUFFER_BIT);

glColor3f(0.0,0.0,1.0);

glEnable(GL_LINE_STIPPLE);

glLineStipple(1, 0xFF);

glBegin(GL_LINES);

glVertex2f(0.5,0.4);

glVertex2f(-0.5,0.4);

glEnd();

Page 49: Computer Graphics

glFlush();}

int main(int argc, ** argv){

glutInit(&argc,arg);

glutInitDisplayMode(GLUT_SINGLE | GLUT_RGB);

glutInitWindowPosition(0,0);

glutInitWindowSize(400,400);

Page 50: Computer Graphics

glutCreateWindow("yeni");

glClearColor(1.0,1.0,1.0,1.0);

glShadeModel(GL_FLAT);

glutDisplayFunc(gosterim);

glutMainLoop();

return 0;

}

Page 51: Computer Graphics

void glEnable ( );

void glDisable ( );

Commands are used for activating and deactivating many of special effect commands

Page 52: Computer Graphics

In this application it is used for enable the dashed line drawing,

GL_LINE_STIPPLE represents dashed drawing type,

glLineStipple(1,0xFF); used to adjust dashed line types. First parameter is multiplier term,

Page 53: Computer Graphics

Second one is a binary design parameter, each zero represents a colorless part of line where 1 represents drawn part.

After design selection it is time to define the coordinates between glBegin ( ) and glEnd ( ).

Page 54: Computer Graphics

Question

• What will happen if we use

glLineStipple(5,0xaa) ?

Page 55: Computer Graphics

Coordinate System

#include"gl/glut.h"

void koordinat(void)

{

glColor3f(0.0,0.0,1.0);

glBegin(GL_LINES);

glVertex2f(0.0,-1.0);

glVertex2f(0.0,1.0);

Page 56: Computer Graphics

glVertex2f(1.0,0.0);

glVertex2f(-1.0,0.0);

glEnd();

}

void gosterim(void)

{ glClear(GL_COLOR_BUFFER_BIT);

koordinat();

glFlush();

}

Page 57: Computer Graphics

int main(int argc,char ** argv)

{

glutInit(&argc,argv);

glutInitDisplayMode(GLUT_SINGLE | GLUT_RGB);

glutInitWindowPosition(0,0);

glutInitWindowSize(400,400);

glutCreateWindow("yeni");

glClearColor(1.0,1.0,1.0,1.0);

glShadeModel(GL_FLAT);

Page 58: Computer Graphics

glutDisplayFunc(gosterim);

glutMainLoop();

return 0;

}

Page 59: Computer Graphics

Question

• Write an OpenGL program to draw dashed line from (-0.5,0.4) to (0.5,0.4) on the coordinate system drawn by solid lines.

Page 60: Computer Graphics

Answer

#include"gl/glut.h«

void kesikcizgi(void)

{

glColor3f(1.0,0.0,0.0);

glEnable(GL_LINE_STIPPLE);

glLineStipple(1 , 0xff);

Page 61: Computer Graphics

glBegin(GL_LINES);

glVertex2f(0.5,0.4);

glVertex2f(-0.5,0.4);

glEnd();

glDisable(GL_LINE_STIPPLE);

}

Page 62: Computer Graphics

void koordinat(void)

{

glColor3f(0.0,0.0,1.0);

glBegin(GL_LINES);

glVertex2f(0.0,-1.0);

glVertex2f(0.0,1.0);

glVertex2f(1.0,0.0);

glVertex2f(-1.0,0.0);

glEnd();

}

Page 63: Computer Graphics

void gosterim(void)

{

glClear(GL_COLOR_BUFFER_BIT);

koordinat();

kesikcizgi();

glFlush();

}

Page 64: Computer Graphics

int main(int argc,char ** argv)

{

glutInit(&argc,argv);

glutInitDisplayMode(GLUT_SINGLE | GLUT_RGB);

glutInitWindowPosition(0,0);

glutInitWindowSize(400,400);

glutCreateWindow("yeni");

Page 65: Computer Graphics

glClearColor(1.0,1.0,1.0,1.0);

glShadeModel(GL_FLAT);

glutDisplayFunc(gosterim);

glutMainLoop();

return 0;

}

Page 66: Computer Graphics

Polygons

• Default values for the polygons have filled front and back surfaces.

• Filling is done with selected colours.

• If we would like to have a not filled drawing, following command must be used:

glPolygonMode(glenum surface, glenum mod);

Page 67: Computer Graphics

• First parameter may have;

GL_FRONT, GL_BACK,

GL_FRONT_AND_BACK

• Second parameter may be;

GL_POINT

GL_LINE

GL_FILL

Page 68: Computer Graphics

Drawing a Triangle

#include"gl/glut.h"

void ucgen(void)

{

glColor3f(0.0,1.0,1.0);

glBegin(GL_TRIANGLES);

glVertex2f(-0.4,-0.4);

glVertex2f(0.4,-0.4);

Page 69: Computer Graphics

glVertex2f(0.0,0.4);

glEnd();

}

void koordinat(void)

{

glColor3f(0.0,0.0,1.0);

glBegin(GL_LINES);

glVertex2f(0.0,-1.0);

Page 70: Computer Graphics

glVertex2f(0.0,1.0);

glVertex2f(1.0,0.0);

glVertex2f(-1.0,0.0);

glEnd();

}

Page 71: Computer Graphics

void gosterim(void)

{

glClear(GL_COLOR_BUFFER_BIT);

ucgen();

koordinat();

glFlush();

}

Page 72: Computer Graphics

int main(int argc,char ** argv)

{

glutInit(&argc,argv);

glutInitDisplayMode(GLUT_SINGLE | GLUT_RGB);

glutInitWindowPosition(0,0);

glutInitWindowSize(400,400);

glutCreateWindow("yeni");

glClearColor(1.0,1.0,1.0,1.0);

Page 73: Computer Graphics

glShadeModel(GL_FLAT);

glutDisplayFunc(gosterim);

glutMainLoop();

return 0;

}

Page 74: Computer Graphics

Question

If the following command line addition takes place to subroutine called as ucgen ( ) as sown below;

void ucgen (void)

glPolygonMode(GL_FRONT,GL_LINE);

What will happen?

Page 75: Computer Graphics

Drawing a Rectangle

#include “gl/glut.h”

void dortgen(void)

{ glPolygonMode(GL_FRONT ,GL_LINE);

glColor3f(0.0,1.0,1.0);

glBegin(GL_QUADS);

glVertex2f(-0.4,-0.4);

Page 76: Computer Graphics

glVertex2f(-0.4,0.4);

glVertex2f(0.4,0.4);

glVertex2f(0.4,-0.4);

glEnd();

}

Page 77: Computer Graphics

void koordinat(void)

{

glColor3f(0.0,0.0,1.0);

glBegin(GL_LINES);

glVertex2f(0.0,-1.0);

glVertex2f(0.0,1.0);

glVertex2f(1.0,0.0);

glVertex2f(-1.0,0.0);

glEnd();

}

Page 78: Computer Graphics

void gosterim(void)

{

glClear(GL_COLOR_BUFFER_BIT);

dortgen();

koordinat();

glFlush();

}

Page 79: Computer Graphics

int main(int argc,char ** argv)

{

glutInit(&argc,argv);

glutInitDisplayMode(GLUT_SINGLE | GLUT_RGB);

glutInitWindowPosition(0,0);

glutInitWindowSize(200,200);

Page 80: Computer Graphics

glutCreateWindow("dörtgen");

glClearColor(1.0,1.0,1.0,1.0);

glShadeModel(GL_FLAT);

glFrontFace(GL_CW);

glutDisplayFunc(gosterim);

glutMainLoop();

return 0;

}

Page 81: Computer Graphics

GL_QUADS directive completes the rectangle.

Sequence of vertex coordinate is important to have a correct rectangle.

Page 82: Computer Graphics

If we add

glPolygonMode(GL_BACK, GL_LINE)

Then a frame view with transparant inner fill will be obtained.

This situation is directly resulted from the drawing sequence given by the program.

Page 83: Computer Graphics

If drawing is done in counter clock wise direction then front of the shape drawn is assumed.

In counter clock wise direction the drawn figure will be the back of the shape.

Page 84: Computer Graphics

Adjustment of this situation can be done by changing

glFrontFace(type)

if type is selected as GL_CCW then counter clock wise will be front,

if type is selected as GL_CW then clock wise direction will be front.

Page 85: Computer Graphics

Another method for drawing a rectangle is to use command:

glRectf(-x1, -y1, x2, y2);

x1 and x2 are coordinates of width,

y1 and y2 are coordinates of length.

Page 86: Computer Graphics

#include “gl/glut.h”

void koordinat(void)

{

glColor3f(0.0,0.0,1.0);

glBegin(GL_LINES);

glVertex2f(0.0,-1.0);

glVertex2f(0.0,1.0);

Page 87: Computer Graphics

glVertex2f(1.0,0.0);

glVertex2f(-1.0,0.0);

glEnd();

}

void dikdortgen(void){ glColor3f(0.0,0.5,0.8);

glRectf(-0.5,-0.4,0.5,0.4);

}

Page 88: Computer Graphics

void gosterim(void)

{

glClear(GL_COLOR_BUFFER_BIT);

dikdortgen();

koordinat();

glFlush();

}

Page 89: Computer Graphics

int main(int argc,char ** argv)

{

glutInit(&argc,argv);

glutInitDisplayMode(GLUT_SINGLE | GLUT_RGB);

glutInitWindowPosition(0,0);

glutInitWindowSize(400,400);

glutCreateWindow("yeni");

Page 90: Computer Graphics

glClearColor(1.0,1.0,1.0,1.0);

glShadeModel(GL_FLAT);

glutDisplayFunc(gosterim);

glutMainLoop();

return 0;

}

Page 91: Computer Graphics

Drawing a Circle

Coordinates of a point on a circle are

X= R * cos α and Y = R * sin α

Where α is in Radian scale.

Radian = (2 * π * Degree ) / 360

Page 92: Computer Graphics

#include"gl/glut.h"

#include"math.h"

void gosterim(void)

{ double der=0;

int a=0;

glClear(GL_COLOR_BUFFER_BIT);

glColor3f(0.0,0.0,1.0);

Page 93: Computer Graphics

glBegin(GL_POLYGON);

for(a=0;a<360;a++)

{

der=2*3.14*a/360;

glVertex2f(cos(der)*0.5 , sin(der)*0.5);

}

glEnd();

glFlush();

}

Page 94: Computer Graphics

int main(int argc,char ** argv)

{

glutInit(&argc,argv);

glutInitDisplayMode(GLUT_SINGLE | GLUT_RGB);

glutInitWindowPosition(0,0);

glutInitWindowSize(400,400);

glutCreateWindow("çember");

Page 95: Computer Graphics

glClearColor(1.0,1.0,1.0,1.0);

glShadeModel(GL_FLAT);

glPolygonMode(GL_FRONT,GL_FILL);

glutDisplayFunc(gosterim);

glutMainLoop();

return 0;

}

Page 96: Computer Graphics

GL_LINE_LOOP makes connection among points. No filling is contained by this command.

If a filling effect is required

glBegin(GL_POLYGON)

can be written.

Then a filled circle will be obtained.

Page 97: Computer Graphics

Question

If we write following GL program what kind of output will be seen?

Page 98: Computer Graphics

#include"gl/glut.h"

#include"math.h“

void gosterim(void)

{ double der=0;

int a=0;

glClear(GL_COLOR_BUFFER_BIT);

glColor3f(0.0,0.0,1.0);

glBegin(GL_POINTS);

Page 99: Computer Graphics

for(a=0;a<6;a++)

{

der=2*3.14*a/6;

glVertex2f(cos(der)*0.5 , sin(der)*0.5);

}

glEnd();

glFlush();

}

Page 100: Computer Graphics

int main(int argc,char ** argv)

{

glutInit(&argc,argv);

glutInitDisplayMode(GLUT_SINGLE | GLUT_RGB);

glutInitWindowPosition(0,0);

glutInitWindowSize(200,200);

glutCreateWindow("altıgen");

Page 101: Computer Graphics

glClearColor(1.0,1.0,1.0,1.0);

glShadeModel(GL_FLAT);

glPolygonMode(GL_FRONT,GL_FILL);

glutDisplayFunc(gosterim);

glutMainLoop();

return 0;

}

Page 102: Computer Graphics

TRANSFORMATIONS

• We can place our object in anywhere by utilizing transformations.

• They supply push, pull, lengthen, translate, move, shrink effects for any object.

• Basic types are:– Scale transform– Translate transform

Page 103: Computer Graphics

– Rotate transform– View transforms

• Perspective view

• Relative view

Page 104: Computer Graphics

• Scale transformglScalef(float x, float y, float z);

If any one of x, y and z parameter is greater than 1.0, it expands otherwise shrinks.

Exp: glScalef(0.5, 3.0, 0.0);

Page 105: Computer Graphics

Application Example

#include"gl/glut.h"

void ucgen(void)

{

glColor3f(0.0,1.0,1.0);

// glLoadIdentity();

glScalef(0.5,3.0,0.0);

Page 106: Computer Graphics

glBegin(GL_TRIANGLES);

glVertex2f(-0.2,-0.2);

glVertex2f(0.2,-0.2);

glVertex2f(0.0,0.2);

glEnd();

}

Page 107: Computer Graphics

void gosterim(void)

{

glClear(GL_COLOR_BUFFER_BIT);

ucgen();

glFlush();

}

Page 108: Computer Graphics

int main(int argc,char ** argv)

{

glutInit(&argc,argv);

glutInitDisplayMode(GLUT_SINGLE | GLUT_RGB);

glutInitWindowPosition(0,0);

glutInitWindowSize(400,400);

glutCreateWindow("donusum");

Page 109: Computer Graphics

glClearColor(1.0,1.0,1.0,1.0);

glShadeModel(GL_FLAT);

glutDisplayFunc(gosterim);

glutMainLoop();

return 0;

}

Page 110: Computer Graphics

Problem

• Sequential applications of scaling causes recursive scaling deformation result.

• To overcome this problem;

glLoadIdentity( ) operation is utilized. This function resets view during each sequential scaling transformation

Page 111: Computer Graphics

Translate Transformation

• Supports moving effect for any object drawn in the window

glTranslatef( float x, float y, float z);

x, y and z coordinates may have -1, 1 values.

Page 112: Computer Graphics

• Translations are done according to center of the object.

Change your previous ucgen subroutine as in the next slide:

Page 113: Computer Graphics

void ucgen(void)

{

glColor3f(0.0,1.0,1.0);

glLoadIdentity();

glScalef(0.5,3.0,0.0);

glTranslatef(0.5,0.5,0.0);

Page 114: Computer Graphics

glBegin(GL_TRIANGLES);

glVertex2f(-0.2,-0.2);

glVertex2f(0.2,-0.2);

glVertex2f(0.0,0.2);

glEnd();

}

Page 115: Computer Graphics

Rotate Transform

• Turning effects of objects around their own axis are called as rotate transforms.

glRotatef(float angle, float x, float y, float z);

Positive values for x, y and z represents Counter Clock Wise direction.

Page 116: Computer Graphics

Example

#include"gl/glut.h"

float a=0;

void hesapla(void)

{

a=a+0.5;

glutPostRedisplay();

}

Page 117: Computer Graphics

void ucgen(void)

{

glColor3f(0.0,1.0,1.0);

glRotatef(a,0.0,0.0,-1.0);

glBegin(GL_TRIANGLES);

glVertex2f(-0.2,-0.2);

glVertex2f(0.2,-0.2);

glVertex2f(0.0,0.2);

glEnd();

}

Page 118: Computer Graphics

void gosterim(void)

{

glClear(GL_COLOR_BUFFER_BIT);

glLoadIdentity();

hesapla();

ucgen();

glutSwapBuffers();

}

Page 119: Computer Graphics

int main(int argc,char ** argv)

{

glutInit(&argc,argv);

glutInitDisplayMode(GLUT_DOUBLE | GLUT_RGB);

glutInitWindowPosition(0,0);

glutInitWindowSize(200,200);

Page 120: Computer Graphics

glutCreateWindow("dondurme");

glClearColor(1.0,1.0,1.0,1.0);

glShadeModel(GL_FLAT);

glutDisplayFunc(gosterim);

glutMainLoop();

return 0;

}

Page 121: Computer Graphics

Viewport Transform

• Limits the area that is used to place the object.

glViewport(x, y, width, length);

x and y declares the left bottom corner axis values, width and length values declares right upper corner values.

Page 122: Computer Graphics

Example

#include"gl/glut.h"

float a=0;

void hesapla(void)

{

a=a+0.5;

glutPostRedisplay();

}

Page 123: Computer Graphics

void ucgen(void)

{

glColor3f(0.0,1.0,1.0);

glRotatef(a,0.0,0.0,-1.0);

glBegin(GL_TRIANGLES);

glVertex2f(-0.2,-0.2);

glVertex2f(0.2,-0.2);

glVertex2f(0.0,0.2);

glEnd();

}

Page 124: Computer Graphics

void gosterim(void)

{

glClear(GL_COLOR_BUFFER_BIT);

glLoadIdentity();

glViewport(0,0,400,400);

ucgen();

hesapla();

glLoadIdentity();

Page 125: Computer Graphics

glViewport(200,200,200,200);

ucgen();

hesapla();

glLoadIdentity();

glViewport(0,200,200,200);

ucgen();

hesapla();

glLoadIdentity();

Page 126: Computer Graphics

glViewport(0,0,200,200);

ucgen();

hesapla();

glLoadIdentity();

glViewport(200,0,200,200);

ucgen();

hesapla();

glutSwapBuffers();

}

Page 127: Computer Graphics

int main(int argc,char ** argv)

{

glutInit(&argc,argv);

glutInitDisplayMode(GLUT_DOUBLE | GLUT_RGB);

glutInitWindowPosition(0,0);

glutInitWindowSize(400,400);

Page 128: Computer Graphics

glutCreateWindow("coklu goruntu");

glClearColor(1.0,1.0,1.0,1.0);

glShadeModel(GL_FLAT);

glutDisplayFunc(gosterim);

glutMainLoop();

return 0;

}

Page 129: Computer Graphics

Orthogonal View Transform

• Supplies adjustment of volume size for view;

• Used for zoom in and zoom out actions;

• These utilities are done by adjusting the axis sizes;

• With orthogonal transform the default range (-1 to 1) can be changed

Page 130: Computer Graphics

Usage of Command

glOrtho2D(-x, x, -y, y);

New axis values for –x, x, -y and y are set after execution of the command

glOrtho(-x, x, -y, y, -z, z);

Page 131: Computer Graphics

Example

#include"gl/glut.h"

float a=0;

void hesapla(void)

{

a=a+0.5;

glutPostRedisplay();

}

Page 132: Computer Graphics

void ucgen(void)

{

glColor3f(0.0,1.0,1.0);

glRotatef(a,0.0,0.0,1.0);

glBegin(GL_TRIANGLES);

glVertex2f(-1.2,-1.2);

glVertex2f(1.2,-1.2);

glVertex2f(0.0,1.2);

glEnd();

}

Page 133: Computer Graphics

void gosterim(void)

{

glClear(GL_COLOR_BUFFER_BIT);

glLoadIdentity();

glViewport(0,0,400,400);

gluOrtho2D(-1.0,1.0,-1.0,1.0);

ucgen();

hesapla();

glutSwapBuffers();

}

Page 134: Computer Graphics

int main(int argc,char ** argv)

{

glutInit(&argc,argv);

glutInitDisplayMode(GLUT_DOUBLE | GLUT_RGB);

glutInitWindowPosition(0,0);

glutInitWindowSize(400,400);

glutCreateWindow("gösterim 1");

Page 135: Computer Graphics

glClearColor(1.0,1.0,1.0,1.0);

glShadeModel(GL_FLAT);

glutDisplayFunc(gosterim);

glutMainLoop();

return 0;

}

Page 136: Computer Graphics

Problem

How can we overcome fixed size problem of objects, after changing size of corresponding window?

Answer:

glutReshapeFunc( )

Page 137: Computer Graphics

Solution

#include"gl/glut.h"

float a=0;

void hesapla(void)

{

a=a+0.5;

glutPostRedisplay();

}

Page 138: Computer Graphics

void ucgen(void)

{

glColor3f(0.0,1.0,1.0);

glRotatef(a,0.0,0.0,1.0);

glBegin(GL_TRIANGLES);

glVertex2f(-1.2,-1.2);

glVertex2f(1.2,-1.2);

glVertex2f(0.0,1.2);

glEnd();

}

Page 139: Computer Graphics

void gosterim(void)

{

glClear(GL_COLOR_BUFFER_BIT);

glLoadIdentity();

ucgen();

hesapla();

glutSwapBuffers();

}

Page 140: Computer Graphics

void boyut(int en, int boy){

glViewport(0,0,(GLsizei)en,(GLsizei)boy);

glLoadIdentity();

}

int main(int argc,char ** argv)

{

glutInit(&argc,argv);

glutInitDisplayMode(GLUT_DOUBLE | GLUT_RGB);

Page 141: Computer Graphics

glutInitWindowPosition(0,0);

glutInitWindowSize(400,400);

glutCreateWindow("gösterim 1");

glClearColor(1.0,1.0,1.0,1.0);

glShadeModel(GL_FLAT);

glutReshapeFunc(boyut);

glutDisplayFunc(gosterim);

glutMainLoop();

return 0;

}

Page 142: Computer Graphics

Question

How can we apply sequential viewport transforms without mixing of operations?

Page 143: Computer Graphics

Solution

Applying

glMatrixMode( )

It may have

GL_PROJECTION

Or

GL_MODELVIEW

Page 144: Computer Graphics

Each glMatrixMode ( ) command must be followed by

glLoadIdentity ( )

Page 145: Computer Graphics

Perspective views

Two perspective view transforms are popular:

glFrustum(double sol, double sag, double alt, double ust, double yakin, double uzak)

gluLookAt ( )

These views are valid for 3D objects.

Page 146: Computer Graphics

3D MODELING

#include <GL/glut.h>

int en=200,boy=200;float derece=0;

void basla(void)

{

glClearColor (1.0, 1.0, 1.0, 1.0);

glShadeModel (GL_FLAT);

Page 147: Computer Graphics

glPolygonMode(GL_FRONT_AND_BACK,GL_LINE);

}

void ucbcokgen(void)

{

glPushMatrix();

glColor3f(0.5,0.1,0.1);

glRotatef(60,0.0,1.0,0.0);

glBegin(GL_QUADS);

glVertex3f(-0.4,0.3,0.1);//önyüz

Page 148: Computer Graphics

glVertex3f(0.4,0.3,0.1);

glVertex3f(0.4,-0.3,0.1);

glVertex3f(-0.4,-0.3,0.1);

glEnd();

glBegin(GL_QUADS);

glVertex3f(-0.4,0.3,-0.1); //solyanyüz

glVertex3f(-0.4,0.3,0.1);

glVertex3f(-0.4,-0.3,0.1);

glVertex3f(-0.4,-0.3,-0.1);

glEnd();

Page 149: Computer Graphics

glBegin(GL_QUADS);

glVertex3f(-0.4,0.3,-0.1);//arkayüz

glVertex3f(0.4,0.3,-0.1);

glVertex3f(0.4,-0.3,-0.1);

glVertex3f(-0.4,-0.3,-0.1);

glEnd();

Page 150: Computer Graphics

glBegin(GL_QUADS);

glVertex3f(0.4,0.3,-0.1); //sağyanyüz

glVertex3f(0.4,0.3,0.1);

glVertex3f(0.4,-0.3,0.1);

glVertex3f(0.4,-0.3,-0.1);

glEnd();

Page 151: Computer Graphics

glBegin(GL_QUADS);

glVertex3f(-0.4,0.3,0.1);//üstkapak

glVertex3f(0.4,0.3,0.1);

glVertex3f(0.4,0.3,-0.1);

glVertex3f(-0.4,0.3,-0.1);

glEnd();

Page 152: Computer Graphics

glBegin(GL_QUADS);

glVertex3f(0.4,-0.3,0.1);//altkapak

glVertex3f(-0.4,-0.3,0.1);

glVertex3f(-0.4,-0.3,-0.1);

glVertex3f(0.4,-0.3,-0.1);

glEnd();

glPopMatrix();

}

Page 153: Computer Graphics

void cizimyeri(void)

{

glClear (GL_COLOR_BUFFER_BIT);

glColor3f (1.0, 1.0, 1.0);

glLoadIdentity ();

glTranslatef(0.0,0.0,-2.0);

ucbcokgen();

glutSwapBuffers();

}

Page 154: Computer Graphics

void tekrarboyut (int en, int boy)

{

glViewport (0, 0, en, boy);

glMatrixMode (GL_PROJECTION);

glLoadIdentity ();

//gluPerspective(90,(float)en/(float)boy,1.0,20000.0);

Page 155: Computer Graphics

if(en<=boy)

glFrustum (-1.0, 1.0, -1.0*en/boy, 1.0*en/boy, 1.0, 1000.0);

else

glFrustum (-1.0*en/boy, 1.0*en/boy, -1.0, 1.0, 1.0, 1000.0);

glMatrixMode (GL_MODELVIEW);

}

Page 156: Computer Graphics

int main(int argc, char** argv)

{

glutInit(&argc, argv);

glutInitDisplayMode (GLUT_DOUBLE | GLUT_RGB);

glutInitWindowSize (en, boy);

glutInitWindowPosition (0, 0);

glutCreateWindow ("3bçokgen1");

Page 157: Computer Graphics

basla ();

glutReshapeFunc(tekrarboyut);

glutDisplayFunc(cizimyeri);

glutMainLoop();

return 0;

}

Page 158: Computer Graphics

Keyboard Functions

Two functions are utilized for keyboard interactions:

glutKeyboardFunc( )

And

glutSpecialFunc( )

Page 159: Computer Graphics

glutKeyboardFunc( ) requires an input function declaring character or special function keys;

-Let us assume a function called as klavye is used for the declaration

-If it is declared as:

Void klavye(unsigned char tus, int x, int y)

Page 160: Computer Graphics

This function only allows to use character keys,

Where;

void klavye(int tus, int x, int y)

Allows to use special function keys.

Page 161: Computer Graphics

Special Function KeysGLUT_KEY_F1

GLUT_KEY_F2

GLUT_KEY_F3

GLUT_KEY_F4

GLUT_KEY_F5

GLUT_KEY_F6

GLUT_KEY_F7

GLUT_KEY_F8

Page 162: Computer Graphics

GLUT_KEY_F9

GLUT_KEY_F10

GLUT_KEY_F11

GLUT_KEY_F12

GLUT_KEY_LEFT

GLUT_KEY_RIGHT

GLUT_KEY_UP

GLUT_KEY_DOWN

Page 163: Computer Graphics

GLUT_KEY_PAGE_UP

GLUT_KEY_PAGE_DOWN

GLUT_KEY_HOME

GLUT_KEY_END

GLUT_KEY_INSERT

Page 164: Computer Graphics

gluLookAt(x0, y0, z0, x1, y1, z1, x2, y2, z2)

x0, y0 and z0 are used for the mounting place (coordinates) of the camera,

x1, y1 and z1 are directions of focusing

x2, y2 and z2 are directions for camera angles

Page 165: Computer Graphics

Example

#include <GL/glut.h>

float xgotur=0,ygotur=0,zgotur=0;

int en=200,boy=200;float derece=0;

float xolcu=1,yolcu=1,zolcu=1;

Page 166: Computer Graphics

void gotursag(void)

{

glLoadIdentity();

xgotur+=0.1;

}

void gotursol(void)

{

glLoadIdentity();

xgotur-=0.1;

}

Page 167: Computer Graphics

void goturyuk(void)

{

glLoadIdentity();

ygotur+=0.1;

}

Page 168: Computer Graphics

void goturas(void)

{

glLoadIdentity();

ygotur-=0.1;

}

void goturil(void)

{

glLoadIdentity();

zgotur-=0.1;

}

Page 169: Computer Graphics

void goturger(void)

{

glLoadIdentity();

zgotur+=0.1;

}

void yanuzat(void)

{

glLoadIdentity();

xolcu+=0.1;

}

Page 170: Computer Graphics

void boyuzat(void)

{

glLoadIdentity();

yolcu+=0.1;

}

void cevirsag(void)

{

glLoadIdentity();

derece+=0.5;

}

Page 171: Computer Graphics

void cevirsol(void)

{

glLoadIdentity();

derece-=0.5;

}

void basla(void)

{

glClearColor (1.0, 1.0, 1.0, 1.0);

glShadeModel (GL_FLAT);

Page 172: Computer Graphics

glPolygonMode(GL_FRONT_AND_BACK,GL_FILL);

}

Page 173: Computer Graphics

void klavye(int dugme,int x,int y)

{

switch(dugme)

{

case GLUT_KEY_LEFT:gotursol();break;

case GLUT_KEY_RIGHT:gotursag();break;

case GLUT_KEY_UP:goturyuk();break;

case GLUT_KEY_DOWN:goturas();break;

case GLUT_KEY_PAGE_UP:goturil();break;

Page 174: Computer Graphics

case GLUT_KEY_PAGE_DOWN:goturger();break;

}

glutPostRedisplay();

}

Page 175: Computer Graphics

void klavye(unsigned char dugme,int x,int y)

{

switch(dugme)

{

case 'a':yanuzat();break;

case's':boyuzat();break;

case'z':cevirsol();break;

case'x':cevirsag();break;

}

glutPostRedisplay();

}

Page 176: Computer Graphics

void ucbcokgen(void)

{

glPushMatrix();

glColor3f(0.5,0.1,0.1);

glTranslatef(xgotur,ygotur,zgotur);

glRotatef(derece,0.0,1.0,0.0);

glScalef(xolcu,yolcu,zolcu);

Page 177: Computer Graphics

glBegin(GL_QUADS);

glVertex3f(-0.4,0.3,0.1);//önyüz

glVertex3f(0.4,0.3,0.1);

glVertex3f(0.4,-0.3,0.1);

glVertex3f(-0.4,-0.3,0.1);

glEnd();

Page 178: Computer Graphics

glBegin(GL_QUADS);

glVertex3f(-0.4,0.3,-0.1); //solyanyüz

glVertex3f(-0.4,0.3,0.1);

glVertex3f(-0.4,-0.3,0.1);

glVertex3f(-0.4,-0.3,-0.1);

glEnd();

Page 179: Computer Graphics

glBegin(GL_QUADS);

glVertex3f(-0.4,0.3,-0.1);//arkayüz

glVertex3f(0.4,0.3,-0.1);

glVertex3f(0.4,-0.3,-0.1);

glVertex3f(-0.4,-0.3,-0.1);

glEnd();

Page 180: Computer Graphics

glBegin(GL_QUADS);

glVertex3f(0.4,0.3,-0.1); //sağyanyüz

glVertex3f(0.4,0.3,0.1);

glVertex3f(0.4,-0.3,0.1);

glVertex3f(0.4,-0.3,-0.1);

glEnd();

Page 181: Computer Graphics

glBegin(GL_QUADS);

glVertex3f(-0.4,0.3,0.1);//üstkapak

glVertex3f(0.4,0.3,0.1);

glVertex3f(0.4,0.3,-0.1);

glVertex3f(-0.4,0.3,-0.1);

glEnd();

Page 182: Computer Graphics

glBegin(GL_QUADS);

glVertex3f(0.4,-0.3,0.1);//altkapak

glVertex3f(-0.4,-0.3,0.1);

glVertex3f(-0.4,-0.3,-0.1);

glVertex3f(0.4,-0.3,-0.1);

glEnd();

glPopMatrix();

}

Page 183: Computer Graphics

void cizimyeri(void)

{

glClear (GL_COLOR_BUFFER_BIT);

glColor3f (1.0, 1.0, 1.0);

glLoadIdentity ();

gluLookAt(0.0,0.0,2.0 , 0.0,0.0,0.0 , 0.0,1.0,0.0);

ucbcokgen();

glutSwapBuffers();

}

Page 184: Computer Graphics

void tekrarboyut (int en, int boy)

{

glViewport (0, 0, en, boy);

glMatrixMode (GL_PROJECTION);

glLoadIdentity ();

gluPerspective(90,(float)en/(float)boy,1.0,100.0);

glMatrixMode (GL_MODELVIEW);

}

Page 185: Computer Graphics

int main(int argc, char** argv)

{

glutInit(&argc, argv);

glutInitDisplayMode (GLUT_DOUBLE | GLUT_RGB);

glutInitWindowSize (en, boy);

glutInitWindowPosition (0, 0);

glutCreateWindow ("3bçokgen2");

basla ();

Page 186: Computer Graphics

glutReshapeFunc(tekrarboyut);

glutDisplayFunc(cizimyeri);

glutSpecialFunc(klavye);

glutKeyboardFunc(klavye);

glutMainLoop();

return 0;

}