Cg Project Report

ABSTRACT

Title of project : Graphics Editor

Aim : To implement a graphics editor which must satisfy the following functions :

1. OpenGL based graphics editor, which provides options for drawing primitives like line, rectangle , circle , ellipse.

2. Drawing options such as pencil , eraser , paint , brush and spray.3. Other options includes reset and exit.

Software requirement specifications:

Platform used : WINDOWS

Software used :

OPENGL

Explanation :

In short all the basic features necessary for the graphics editor have been provided. Care is taken to provide an easy-to-use mouse interface involving an icon-based interaction to provide an intuitive feel to our graphics editor.

Graphics editor

TABLE OF CONTENTS

INDEX Page No.

1. Introduction

1.1 Computer Graphics 2

1.2 OpenGL 2

1.3 Project Goal 10

1.4 Scope 10

2. Introduction To Graphics Editor

2.1 Editor 11

2.2 Basic Functions Of Editor 13

3. Hardware And Software Requirements 14

4. Design 15

5. Testing and Results 17

Dept. of CSE, BNMIT 2009-2010

Graphics editor

6. Implementation

6.1 Main Algorithm 18 6.2 Algorithm used 20

6.3 Module Description 23

6.4 Snapshot 25

7. Conclusion and Future Enhancements 31

8. Bibliography 32


Graphics editor

1. Introduction

1.1 Computer Graphics

Graphics provides one of the most natural means of communicating with a computer,

since our highly developed 2D and 3D pattern-recognition abilities allow us to perceive and

process pictorial data rapidly and efficiently. Interactive computer graphics is the most

important means of producing pictures since the invention of photography and television. It

has the added advantage that, with the computer, we can make pictures not only of concrete

real world objects but also of abstract, synthetic objects, such as mathematical surfaces and

of data that have no inherent geometry, such as survey results.

Using this editor you can draw and paint using the mouse. It can also perform a host

of other functions like drawing lines, circles, polygons and so on. Interactive picture

construction techniques such as basic positioning methods, rubber-band methods, dragging

and drawing are used. Block operations like cut, copy and paste are supported to edit large

areas of the workspace simultaneously. It is user friendly and intuitive to use.

1.2 OpenGL

OpenGL(open graphics library) is a standard specification defining a cross language

cross platform API for writing applications that produce 2D and 3D computer graphics. The

interface consists of over 250 different function calls which can be used to draw complex 3D

scenes from simple primitives. OpenGL was developed by silicon graphics Inc.(SGI) in 1992

and is widely used in CAD ,virtual reality , scientific visualization , information visualization

and flight simulation. It is also used in video games, where it competes with direct 3D on

Microsoft Windows platforms.OpenGL is managed by the non profit technology

consortium , the khronos group, Inc


Graphics editor

OpenGL serves two main purpose :

To hide the complexities of interfacing with different 3D accelerators,by

presenting programmer with a single, uniform API

To hide the differing capabilities of hardware platforms , by requiring that all

Implementations support the full openGL feature set.

OpenGL has historically been influential on the development of 3D accelerator, promoting a

base level of functionality that is now common in consumer level hardware:

Rasterized points, lines and polygons are basic primitives.

A transform and lighting pipeline .

Z buffering .

Texture Mapping.

Alpha Blending.


Graphics editor

glClearColor(0.0,0.0,0.0,0.0);DescriptionThis function sets the color value that will be used when clearing the color buffer with glClear(GL_COLOR_BUFFER_BIT).

glMatrixMode(GL_PROJECTION);DescriptionThis function is used to determine which matrix stack (GL_MODELVIEW,GL_PROJECTION, or GL_TEXTURE) will be used for matrix operations

glLoadIdentity();DescriptionThis function replaces the current Transformation matrix with the Identity matrix.This essentially resets the coordinate system to eye coordinates.

gluOrtho2D(0.0,1010.0,0.0,700.0);DescriptionThis function defines a 2D orthographic projection matrix. This projection matrix is equivalent to calling glOrtho with near and far set to 0 and 1, respectively.

glColor3fv(colors[s]);


Graphics editor

DescriptionThis function sets the current color by specifying separate red, green, and bluecomponents of the color. Some functions also accept an alpha component. Eachcomponent represents the range of intensity from zero (0.0) to full intensity (1.0).Functions with the v suffix take a pointer to an array that specifies the components

glVertex2i(cx,cy);DescriptionThis function is used to specify the vertex coordinates of the points, lines, andpolygons specified by a previous call to glBegin. This function may not be called outside the scope of a glBegin/glEnd pair.

glEnd();DescriptionThis function is used in conjunction with glBegin to delimit the vertices of anOpenGL primitive. Multiple vertices sets may be included within a singleglBegin/glEnd pair, as long as they are for the same primitive type. Other settings may also be made with additional OpenGL commands that affect the vertices following them. Only these OpenGL functions may be called within a glBegin/glEndsequence: glVertex, glColor, glIndex, glNormal, glEvalCoord, glCallList,glCallLists, glTexCoord, glEdgeFlag, and glMaterialglPointSize(1.0);

glBegin(GL_LINE_LOOP);DescriptionThis function is used in conjunction with glEnd to delimit the vertices of an OpenGL primitive. Multiple vertices sets may be included within a single


Graphics editor

glBegin/glEnd pair, as long as they are for the same primitive type. Other settings may also be made withadditional OpenGL commands that affect the vertices following them. Only these OpenGL functions may be called within a glBegin/glEnd sequence: glVertex,glColor, glIndex, glNormal, glEvalCoord, glCallList, glCallLists, glTexCoord, glEdgeFlag, and glMaterial

glReadPixels(x,y,1,1,GL_RGB,GL_FLOAT,curfiller)Syntaxvoid glReadPixels(GLint x, GLint y, GLsizei width, GLsizei height, GLenumformat, GLenum type, const Glvoid *pixels);DescriptionThis function copies pixel data from the framebuffer to memory. Besides the format and type arguments, several other parameters define the encoding of pixel data in memory and control the processing of the pixel data before it is placed in the memory buffer. See the references for glPixelMap, glPixelStore, glPixelTransfer.glRasterPos3f(x, y,z);

glutBitmapCharacter(font, *c);DescriptionWithout using any display lists, glutBitmapCharacter renders the character in the named bitmap font. The available fonts are:GLUT BITMAP 8 BY 13 A fixed width font with every character fitting in an 8 by 13 pixel rectangle. The exact bitmaps to be used is defined by the standard X glyph bitmaps for the X font named:

glRectf(5+k,620,80+k,600);

This function is an efficient method of specifying a rectangle as two corner points.Dept. of CSE, BNMIT 2009-2010

Graphics editor

The rectangle is drawn in the xy plane at z = 0.

glPointSizeDescriptionThis function sets the diameter in pixels of points drawn with the GL_POINTSprimitive.

glutInit(&argc,argv);DescriptionglutInit will initialize the GLUT library and negotiate a session with the window system. During this process,glutInit may cause the termination of the GLUT program with an error message to the user if GLUTcannot be properly initialized. Examples of this situation include the failure to connect to the window system,the lack of window system support for OpenGL, and invalid command line options.glutInit also processes command line options, but the specific options parse are window system dependent.

glutInitDisplayMode(GLUT_RGB|GLUT_SINGLE);DescriptionThe initial display mode is used when creating top-level windows, subwindows, and overlays to determine theOpenGL display mode for the to-be-created window or overlay.Note that GLUT RGBA selects the RGBA color model, but it does not request any bits of alpha (sometimescalled an alpha buffer or destination alpha) be allocated. To request alpha, specify GLUT ALPHA. The sameapplies to GLUT LUMINANCE


Graphics editor

glutInitWindowSize(1010,700);glutInitWindowPosition(0,0);

DescriptionWindows created by glutCreateWindow will be requested to be created with the current initial window position and size.The initial value of the initial window position GLUT state is -1 and -1. If either the X or Y component to the initial window position is negative, the actual window position is left to the window system to determine.The initial value of the initialwindow size GLUT state is 300 by 300. The initialwindow size componentsmust be greater than zero.The intent of the initial window position and size values is to provide a suggestion to the window system fora window’s initial size and position. The window system is not obligated to use this information. Therefore, GLUT programs should not assume thewindow was created at the specified size or position.

glutCreateWindow("EDITOR");

glutDisplayFunc(display);DescriptionglutDisplayFunc sets the display callback for the current window. When GLUT determines that the normal plane for the window needs to be redisplayed, the display callback for the window is called. Before thecallback, the current window is set to the window needing to be redisplayed and (if no overlay display callback is registered) the layer in use is set to the normal plane. The display callback is called with no parameters. Theentire normal plane region should be redisplayed in response to the callback (this includes ancillary buffers ifyour program depends on their state).


Graphics editor

glutMouseFunc(mouse);

glutMouseFunc sets the mouse callback for the current window. When a user presses and releases mouse buttons in the window, each press and each release generates a mouse callback. The button parameter is one of GLUT LEFT BUTTON, GLUT MIDDLE BUTTON, or GLUT RIGHT BUTTON. For systems with only two mouse buttons, it may not be possible to generate GLUT MIDDLE BUTTON callback. For systems with a singlemouse button, it may be possible to generate only a GLUT LEFT BUTTON callback

glutMotionFunc(mousemotion);glutPassiveMotionFunc(motion);

DescriptionglutMotionFunc and glutPassiveMotionFunc set the motion and passive motion callback respectively for the current window. The motion callback for a window is called when the mouse moves within the window while one or more mouse buttons are pressed. The passive motion callback for a window is called when the mouse moves within the window while no mouse buttons are pressed.The x and y callback parameters indicate the mouse location in window relative coordinates.Passing NULL to glutMotionFunc or glutPassiveMotionFunc disables the generation of themouse or passive motion callback respectively.

glutMainLoop();DescriptionglutMainLoopenters theGLUT event processing loop. This routine should be called at most once in A glut program. Once called, this routine will never return. It will call as necessary any callbacks that have been registered.


Graphics editor

1.3 Project Goal

The aim of this project is to develop a 2-D graphics package which

supports basic operations which include creating objects like lines, circles,

polygons, spirals, etc and also transformation operations like translation,

rotation, etc on such objects. The package must also have a user-friendly

interface that may be menu-oriented, iconic or a combination of both.

1.4 Scope

It provides most the features that a 2D graphic editor should have. It is

developed in VC++. it has been implemented on WINDOWS platform. The 2-

D graphics package designed here provides an interface for the users for

handling the display and manipulation of basic picture objects like point, line,

rectangle, ellipse, polygon, spiral, etc. It can also perform operations on

selected objects like clipping, translation, rotation, area filling etc. It is capable

of loading and saving the picture files. The interface is user -friendly with icons

for all the functions. The mouse is the main input device used.


Graphics editor

2.INTRODUCTION TO GRAPHICS EDITOR

2.1 Editor

Graphics provides one of the most natural means of communicating with

a computer, since our highly developed 2D and 3D pattern-recognition abilities

allow us to perceive and process pictorial data rapidly and efficiently.

Interactive computer graphics is the most important means of producing

pictures since the invention of photography and television. It has the added

advantage that, with the computer, we can make pictures not only of concrete

real world objects but also of abstract, synthetic objects, such as mathematical

surfaces and of data that have no inherent geometry, such as survey results.

Using this editor you can draw and paint using the mouse. It can also

perform a host of other functions like drawing lines, circles, polygons and so

on. Interactive picture construction techniques such as basic positioning

methods, rubber-band methods, dragging and drawing are used. Block

operations like cut, copy and paste are supported to edit large areas of the

workspace simultaneously. It is user friendly and intuitive to use.

Graphics Editors can normally be classified as:

2D Graphics Editors.

3D Graphics Editors.


Graphics editor

A 2D Graphics Editor is used to draw 2D primitives (Line, Rectangle,

Circle, Ellipse, etc. and alter those with operations like cut, copy and paste.

These may also support features like layers and object precision etc. A simple

2D Graphics Editor should include the following features:

Facilities: Cursor Movement, Editing picture objects

Good User Interface: GUI / Toolbars / Icon based User Interface.

A 3D Graphics Editor refers to program used to create 3D computer-

generated imagery. There are typically many stages in the "pipeline" that

studios use to create 3D objects for film and games. Many 3D modelers are

general-purpose and can be used to produce models of various real-world

entities, from plants to automobiles to people. Some are specially designed to

model certain objects, such as chemical compounds or internal organs.

3D modelers allow users to create and alter models via their 3D mesh.

Users can add, subtract, stretch and otherwise change the mesh to their desire.

Models can be viewed from a variety of angles, usually simultaneously. Models

can be rotated and the view can be zoomed in and out.

3D modelers are used in a wide variety of industries. The medical

industry uses them to create detailed models of organs. The movie industry uses

them to create and manipulate characters and objects for animated and real-life

motion pictures. The video game industry uses them to create assets for video

games. The science sector uses them to create highly detailed models of

chemical compounds. The architecture industry uses them to create models of

proposed buildings and landscapes. The engineering community uses them to

design new devices, vehicles and structures as well as a host of other uses. [5]


Graphics editor

2.2 Basic Functions Of Editor

The objective is to build a graphics editor having all required operations

that a normal graphics editor should offer. The coding is implemented for a

single canvas graphics editor. In this editor importance is given to a simple user

interface and implementation of all basic graphic routines and basic graphic

editing options.

The basic requirements of the graphics editor were analysed to be:

1. User Interface

2. Color Selection

3. Graphics Drawing


Graphics editor

3.HARDWARE AND SOFTWARE REQIREMENTS

Hardware Requirements

Pentium or higher processor.

128 MB or more RAM.

A standard keyboard,compatible mouse and a VGA monitor.

Software Requirements

This graphics package has been designed for WINDOWS 9X,XP

and higher Versions. OpenGL libraries are used and hence VC++ v6.0 or later

is required. OpenGL libraries are used and hence VC++ v6.0 or later is

required.

Development Platform

WINDOWS XP

Language Used In Coding

MICROSOFT VISUAL C++ V6.0


Graphics editor

4.Design

The basic requirements of the graphics editor were analysed to be:

User Interface- The presentation of the graphics editor is crucial to

its acceptance by its users. The package should provide easy selection

and implementation of the features through iconic interfaces.

Color Selection - To select a suitable color for drawing the

primitives. The editor implements support for drawing various shapes

mentioned above. The implementation is done using the graphics scan

conversion algorithm.

Graphics Drawing – To draw basic primitives like line, circle,

ellipse, rectangle on the canvas and to use tools like pencil, flood filling,

eraser, copy, cut, paste etc. to manipulate the image.

Line: Line is drawn by selecting two points start point and the end

point. The start point begins with mouse click and end point is the

point where mouse button is released.

Rectangle: Rectangle is drawn by selecting a start point and

dragging to end point of required size

Circle: Circle is drawn by selecting a point and dragging

thereafter till the desired radius.Dept. of CSE, BNMIT 2009-2010

Graphics editor

Ellipse: Ellipse is drawn by selecting a start point and dragging

till the required radius is achieved.

Freehand Drawing: A freehand drawing is the one in which

wherever mouse is dragged pixels are plotted

Fill Shapes: This is done by selecting a co-ordinate by click of

mouse and the enclosed area of the point is filled with the selected

color.

Other Features:

Eraser: This feature allows deleting particular portions of figure

as selected by click of the user..

Spray: This feature allows plotting of pixels randomly in the

neighboring regions where the mouse is clicked.

Clear :Clears the entire user area.

Bullet : This allows us to create bullets which can be used for

numbering.

Mesh : This allows us to create a rectangular mesh.


Graphics editor

5. TESTING AND RESULTS

The full graphics editior has been designed under windows operating system using Visual C++ 6.0 .the options that in the editor satisfies the basic need of a good editor . Using GL/glut.h library and built-in function it makes easy to design good graphics package such as the graphics editor. The editor is very useful in graphical primitives drawing such as lines, rectangles, circles, ellipses, free hand drawing .The editor is very useful in graphics editing.

The editor has been thoroughly tested for any bugs that may have crept in our design or implementation so far no such bugs have been discovered. Though the aim was to develop a complete graphics editor because of shortage of time lots of features could not be implemented .

Testing involves unit testing, module testing and system testing.

Unit testing: Here the individual components are tested to ensure that they operate

correctly. Each component is tested independently ,without other system components.

Module testing:Module is a collection of dependent components such as procedures and

functions . Since the module encapsulates related components can be tested without other system modules. The testing process is concerned with finding errors which results from erroneous function calls from the main function to various individual functions.

System testing:The modules are integrated to make up the entire system . The testing

process is concerned with finding errors with results from unanticipated


Graphics editor

interactions between module and system components. It is also concerned with validating that the system meets its functional and non-functional requirements.

IMPLEMENTATION

6.1 Main Algorithm

The main algorithm for the graphics editor is the one shown below.

1. Initialize the graphics window and its size using glut functions.

2. Register the mouse ,passivemotion and motion callbacks in main

function.

3. Draw the toolbar icons, color palette, and the user area.

4. Repeat the following steps until the user wants to exit

4.1 Check if left button of the mouse is clicked.

4.2 If so then

4.2.1 Check to see if mouse is on one of the buttons on

Tool bar. If so execute the function associated with

that button.

4.2.2 Else check to see if the mouse is on the color palette.

If so then change the present color to the selected

color.

4.2.3 Else check to see if mouse is on the drawing area. If

so carry on with the operation previously being

executed.Dept. of CSE, BNMIT 2009-2010

Graphics editor

5.Close the graphics window and restore back the CRT mode.

As we see above, the main algorithm is an infinite loop continuously

polling for mouse movements. Whenever the mouse is clicked, the position of

the mouse is checked and depending on the position of the mouse the

appropriate operation is executed. The loop is exited when the user wants to

quit the editor.


Graphics editor

6.2 Algorithms Used

Bresenhem Midpoint Circle Algorithm Given the integer center point and radius, it generates the optimal set of pixels for the circles. We consider only 46 degrees of a circle, the second octant from x=0 to x=y=R/root(2) and use CirclePoints to display points on the entire circle. The strategy is to select which of the 2 pixels is closer to the circle by evaluating a function at the midpoint between the 2 pixels. [2]

Void MidpointCircle( int radius, int value )

{

int x = 0 ; int y = radius ;

int d = 1 – radius ;

int deltaE = 3 ;

int deltaSE = -2 * radius + 5;

Circlepoints( x, y, value );

While( y > x ) {

If( d < 0 ) { /* Select E */

d + = deltaE ;

deltaE + = 2 ;

deltaSE + = 2 ;

}

else { /* Select SE */

d + = deltaSE ;

deltaE + = 2 ;

deltaSE + = 4 ;

y - - ;

}

x + + ;


Graphics editor

CirclePoints( x, y, value );

}

}

Scanline Area Filling Algorithm

This algorithm draws a filled rectangle or square of chosen color when the

mouse is clicked on the user area and dragged on to the required size

void edgedetect(float x1,float y1,float x2,float y2,int *le,int *re)

{

float mx,x,temp;

int i;

if((y2-y1)<0)

{

temp=y1; y1=y2;y2=temp;

temp=x1;x1=x2;x2=temp;

}

if((y2-y1)!=0)

mx=(x2-x1)/(y2-y1);

else

mx=x2-x1;

x=x1;

for(i=y1;i<y2;i++)

{

if(x<(float)le[i])

le[i]=(int)x;

if(x>(float)re[i])


Graphics editor

re[i]=(int)x;

x+=mx;

}

}

SCANFILL ALGORITHM

void scanfill(float x1,float y1,float x2,float y2,float x3,float y3,float x4,float y4)

{

int le[2000],re[2000];

int i,y;

if(test(x1,y1))

if(test(x2,y2))

if(test(x3,y3))

if(test(x4,y4))

{

for(i=0;i<2000;i++)

{

le[i]=2000;

re[i]=0;

}

edgedetect(x1,y1,x2,y2,le,re);




for(y=0;y<2000;y++)

{

if(le[y]<=re[y])


Graphics editor

for(i=(int)le[y];i<(int)re[y];i++)

draw_pixel(i,y);

}

}

6.3 Modules Description

void myinit();Sets the background color and Orthographic Window .

int test(int cx,int cy);Tests if point p(cx,cy) is within user area .

void draw_pixel(GLint cx,GLint cy);Draws a Point given by p(cx,cy).

void scanfill(float x1,float y1,float x2,float y2,float x3,float y3,float x4,float y4);This function draws a filled rectangle or square of chosen color when the mouse

is clicked on the user area and dragged on to the required size.

void spray(int x,int y);A spray function that draws points randomly around a point where mouse is clicked.

void draw(int x,int y);Draws the point wherever mouse is moved while button is held.Used for Pencil and Brush.

int area() ;


Graphics editor

Checks weather the co-ordinates returned by mouse is within user area .

void renderBitmapString(float x,float y,float z,void *font,char *string);Renders the string on the Display.

void circle(GLint hx,GLint hy,GLint r);A function to draw circle.Uses BRESNHAM'S Midpoint Circle drawing algorithm. void drawEllipse(float xradius, float yradius);This function draws ellipse using values of x and y.

void display();A display function that displays entire output on the screen.

void mouse(int btn,int state,int x,int y);A Mouse Function that returns the co-ordinates and pressed button when Mouse is clicked.

void motion(int x,int y);A PassiveMotion Function that returns the x and y co-ordinates when mouse is being moved.

void mousemotion(int x,int y);A Motion Function that returns the x and y co-ordinates when mouse button is being pressed and moved.

void main(int argc,char *argv[]);Main Function to intialise Window for output.Used for registering various functions.

void fill();If the mouse is clicked in any closed region in the user area ,the area is filled with chosen color.

void cube3d();Draws the 3 dimensional cube of any height , width, depth.


Graphics editor

void triangle3d();Draws the 3 dimensional triangle of any height , width, depth.

void ccube3d();Draws the 3 dimensional Colored cube of any height , width, depth.

Void keyboard();Accepts the character from the keyboard and renders it on display.


Graphics editor

SNAPSHOTS


Graphics editor


Graphics editor


Graphics editor


Graphics editor


Graphics editor

Conclusion And Future Enhancements

This graphics is very user friendly tool. The user can very easily use this tool to

draw or manipulate a drawing. The interface is mouse driven and the user can

select a function by clicking on an icon representing that function.

For the user’s help the function performed by each icon is displayed in

the status bar as soon as the mouse pointer moves over the icon. We have tried

our best to make this editor very realistic, so that the user does not face any

trouble when switching over from any real life graphics editor to this highly

useful one.

The following are some of the features that are planned to be supported in the

future versions of the graphics editor.

The package currently is platform dependent and runs only On DOS

based machines so making it portable for other machines also.

Features like "Undo" and "Redo " could be provided.

The editor saves images in a very raw format and cannot load or save in

standard image file formats such as bmp, jpeg, gif. Therefore Support for

different file formats like bmp, jpeg, gif etc. could be provided

Support for advanced 3d drawings and transformations.


Graphics editor

Only Single Document Interface (SDI) has been provided, multiple

document interface can be provided.

Bibliography

1)Reference from Interactive Computer Graphics by EDWARD ANGEL

2)Donald Hearn and Pauline Baker <computer graphics – opengl version

2nd edition, Pearson education,2003>

3) James D Folley,Andries Van Dam ,Steven K Feiner ,John F Huges

<computer graphics adison Wesley -1997>

urls:

www. wikipedia .org

www.codeguru.com

www.openglforum.com


http://www.openglforum.com/

http://www.codeguru.com/

http://www.wikipedia.org/

Graphics editor


Documents

Cg Project Report