6 views

Uploaded by romeofatima

drawing basics

drawing basics

© All Rights Reserved

- Chapter23 Television[1]
- How Television Works
- Ing Form - Infotech- Unit 20
- Monitor Repairing
- menghitung luas tanah dengan excel
- Graphics Lecture
- Cse Mobile Phone Cloning Ppt
- AKIRA 14THS3-CE (chassis UOC-OM8370).pdf
- lelm104
- hertzmann-siggraph98
- eyelashes.pdf
- 33276095 Schelling the Strategy of Conflict
- 3dread
- c 0291722
- 3D ComputerGraphics Lesson3 SimpleSourceCode 2006 22pgs
- Basic Electronics
- Adobe Photoshop
- [2002] Japan_Graphics_Research.pdf
- PetroCor Brochure
- Tvpanasonictc 21fj30la 120719115335 Phpapp01

You are on page 1of 47

Topics

Interactive Graphic Systems

Drawing lines

Drawing circles

Filling polygons

ApplicationModel

Model

Application

ApplicationProgram

Program

Application

GraphicsSystem

System

Graphics

Application Model

Represents data and objects to be displayed on the

output device

Application Program

Creates, stores into, and retrieves from the application

model

Handles user-inputs

Sends output commands to the graphics system:

Which geometric object to view (point, line, circle,

polygon)

How to view it (color, line-style, thickness, texture)

Graphics System

Intermediates between the application program

and the interface hardware:

Output flow

Input flow

Causes the application program to be deviceindependent.

Display Hardware

CRT - Cathode Ray Tube

Cathode

(electron gun)

focusing

anode

shadow mask

and phosphor

coated screen

deflection

yoke

electron guns

shadow mask

phosphors on

glass screen

Scan line

Display Hardware

FED - Field Emission Display

Anode

Phospor

Microtips

(Emitters)

Catode electrodes

pixel

Raster Display

Interaction

data

Display

commands

Keyboard

Mouse

Display

Controller

Graphics

system

155

255

0

1

17

45

66

95

82

78

27

147

55

12

159

36

Frame Buffer

Video

Controller

Terminology

Pixel: Picture element.

- Smallest accessible element in picture

- Assume rectangular or circular shape

Aspect Ratio: Ratio between physical dimensions of a pixel (not necessarily 1)

Dynamic Range: The ratio between the minimal (not zero!) and the maximal

light intensity a display pixel can emit

Resolution: The number of distinguishable rows and columns in the device.

Measured in:

- Absolute values (1K x 1K) or,

- Density values (300 dpi [=dots per inch])

Screen Space: A discrete Cartesian coordinate system of the screen pixels

Object Space: The Cartesian coordinate system of the universe, in which the

objects (to be displayed) are embedded

Scan Conversion

The conversion from a geometrical

representation of an object to pixels in a

raster display

(x1,y1)

(x0,y0)

Representations

Implicit formula:

Constraint(s) expressed as

f(x,y,..)=0

fi(x1,x2,..,xn)=0 ; i=1..n-k

Explicit formula:

For each x define y as y=f(x)

Good only for "functions".

Parametric formula:

Depending on free parameter(s)

x=fx(t)

y=fy(t)

Line in 2 dimensions

Implicit representation:

x + y +

Explicit representation:

y = mx + B

Parametric representation:

x

P =

y

= 0

y1 y 0

m =

x1 x 0

P = P0 + ( P1 P0 ) t

P1

y1

x0

x1

B

P0

t [ 0 .. 1 ]

y0

(x1,y1)

y = mx + B

y1 - y0

x1 - x0

offset= B = y1-mx1

slope = m =

(x0,y0)

Assume |m| 1

Assume x0 x1

Basic Algorithm

For x = x0 to x1

y = mx + B

PlotPixel(x,round(y))

end;

For each iteration: 1 float multiplication, 1 addition, 1 round

Incremental Algorithm

yi+1 = mxi+1 + B = m(xi + x) + B = yi + mx

if x = 1 then

yi+1 = yi + m

Algorithm

y=y0

For x = x0 to x1

PlotPixel(x,round(y))

y= y + m

end;

( xi+1,Round(yi+m) )

( xi, yi )

( xi,Round(yi) )

( xi+1, yi+m )

Assume x1>x0 and line slope absolute value is 1

Line(x0,y0,x1,y1)

begin

float dx, dy, x, y, slope;

dx := x1-x0;

dy := y1-y0;

slope := dy/dx;

y := y0;

for x:=x0 to x1 do

begin

PlotPixel( x,Round(y) );

y := y+slope;

end;

end;

Symmetric Cases:

|m| 1

x = x0

For y = y0 to y1

PlotPixel(round(x),y)

x = x + 1/m

end;

Special Cases:

m = 1 (diagonals)

m = 0, (horizontal, vertical)

1 addition, 1 rounding

Drawbacks:

Accumulated error

Floating point arithmetic

Round operations

Symmetric Cases:

if x0 > x1 for |m| 1 or y0 > y1 for |m| 1

swap((x0,y0),(x1,y1))

Assumptions:

x0 < x1 , y0 < y1

0 < slope < 1

NE

Q

M

(xp,yp)

Bresenham: sign(M-Q) determines NE or E

M = (xp +1,yp +1/2)

y=

dy

x+B

dx

f(x,y) = ax + by + c = 0

f(x,y) = dy x - dx y + B dx = 0

(a>0)

f(x,y) < 0

f(x,y) = 0

f(x,y) > 0

Decision Variable :

d = f(M) = f(xp +1,yp +1/2) = a(xp +1) + b(yp +1/2) + c

choose NE if d > 0

choose E if d 0

What happens at xp + 2 ?

NE

M

M

M

E

(xp,yp)

If E was chosen at xp + 1

dnew = f(xp +2,yp +1/2) = a(xp +2) + b(yp +1/2) + c

dold = f(xp +1,yp +1/2) = a(xp +1) + b(yp +1/2) + c

dnew = dold + a = dold + dy

dnew = dold + E

If NE was chosen at xp + 1

dnew = f(xp +2,yp +3/2) = a(xp +2) + b(yp +3/2) + c

dold = f(xp +1,yp +1/2) = a(xp +1) + b(yp +1/2) + c

dnew = dold + a + b = dold + dy - dx

dnew = dold + NE

Initialization:

First point = (x0,y0), first MidPoint = (x0+1,y0+1/2)

dstart = f(x0 +1,y0+1/2) = a(x0 +1) + b(y0 +1/2) +c

= ax0 + by0 + c + a + b/2

= f(x0,y0) + a + b/2 = a + b/2

dstart =dy - dx/2

Enhancement:

To eliminate fractions, define:

f(x,y) = 2(ax + by + c) = 0

dstart =2dy - dx

E=2dy

NE=2(dy-dx)

The sign of f(x0+1,y0+1/2) indicates whether to move East

or North-East

At the beginning d=f(x0+1,y0+1/2)=2dy-dx

The increment in d (after this step) is:

If we moved East: E=2dy

If we moved North-East: NE=2dy-2dx

Comments:

Integer arithmetic (dx and dy are integers)

One addition for each iteration

No accumulated errors

By symmetry, we deal with 0>slope>-1

Line(x0,y0,x1,y1)

begin

int dx, dy, x, y, d, E, E ;

x:= x0; y=y0;

dx := x1-x0; dy := y1-y0;

d := 2*dy-dx;

E := 2*dy; := 2*(dy-dx);

PlotPixel(x,y);

while(x < x1) do

if (d < 0) then

d:=d+ E;

x:=x+1;

end;

Assume x1>x0 and 0 < slope 1

else

d:=d+ E;

x:=x+1;

y:=y+1;

end;

PlotPixel(x,y);

end;

end;

x

+ y

= 0

Explicit representation:

y =

Parametric representation:

x R cos

=

y R sin

(t )

(t )

t [ 0 .. 2 ]

Basic Algorithm

For x = -R to R

y = sqrt(R2-x2)

PlotPixel(x,round(y))

PlotPixel(x,-round(y))

end;

Comments:

Square-root operations are expensive

Floating point arithmetic

Large gap for x values close to R

Exploiting Eight-Way Symmetry

For a circle centered at the origin:

If (x,y) is on the circle then

(y,x) (y,-x) (x,-y) (-x,-y) (-y,-x) (-y,x) (-x,y)

are on the circle as well.

Therefore we need to compute only one octant (45o) segment.

(-x,y) (x,y)

(-y,x)

(y,x)

(-y,-x)

(y,-x)

(-x,-y)

(x,-y)

CirclePoints(x, y)

begin

PlotPixel(x,y);

PlotPixel(y,x);

PlotPixel(y,-x);

PlotPixel(x,-y);

PlotPixel(-x,-y);

PlotPixel(-y,-x);

PlotPixel(-y,x);

PlotPixel(-x,y);

end;

(-x,y) (x,y)

(-y,x)

(y,x)

(-y,-x)

(y,-x)

(-x,-y)

(x,-y)

(The circle is located at (0,0) with radius R)

One can move either East or South-East

Again, d(x,y) will be a threshold criteria at the midpoint

Threshold Criteria:

d(x,y)=f(x,y) = x2 + y2 -R2 = 0

f(x,y) = 0

f(x,y) < 0

f(x,y) > 0

y0

At the beginning

dstart= d(x0+1,y0-1/2)

= d(1,R-1/2) = 5/4 - R

If d<0 we move East:

x0

E = d(x0+2,y0-1/2) - d(x0+1,y0-1/2) = 2x0+3

if d>0 we move South-East:

Since d is incremented by integer values, we can use

dstart = 1-R

yielding an integer algorithm. This has no affect on the

threshold criteria.

MidpointCircle (R)

begin

int x, y, d;

x := 0;

y :=R;

d := 5.0/4.0-R;

CirclePoints(x,y);

while ( y>x ) do

if ( d<0 ) then

d := d+2x+3;

x := x+1;

end;

else

d := d+2(x-y)+5;

x := x+1;

y := y-1;

end;

CirclePoints( x,y );

end;

/* East */

/* South East */

MidpointCircle (R)

begin

int x, y, d;

x := 0;

y :=R;

d := 1-R;

/* originally d := 5.0/4.0 - R */

CirclePoints(x,y);

while ( y>x ) do

if ( d<0 ) then

/* East */

d := d+2x+3;

/* Multiplication! */

x := x+1;

end;

else

/* South East */

d := d+2(x-y)+5; /* Multiplication! */

x := x+1;

y := y-1;

end;

CirclePoints( x,y );

/* Mirror to create the other seven octants */

end;

Pseudo

Code

for

Circle

Midpoint

MidpointCircle (R)

begin

int x, y, d;

x := 0;

y :=R;

d := 1-R;

E = 3;

SE = -2R+5;

CirclePoints(x,y);

while ( y>x ) do

if ( d<0 ) then

d := d+E;

E := E+2;

SE := SE+2;

x := x+1;

end;

else

d := d+SE;

E := E+2;

SE := SE+4;

x := x+1;

y := y-1;

end;

CirclePoints( x,y );

end;

/* originally d := 5.0/4.0 - R */

/* East */

/* See Foley & van Dam pg. 87 */

/* South East */

/* See Foley & van Dam pg. 87 */

Circle Midpoint

Polygon Fill

Representation:

Polygon = V0, V1, V2, .. Vn

Vi=(xi,yi) - vertex

Ei=(vi,vi+1) - edge

En=(vn,v0)

v0

v2

E0

E6

edge

v1

v4

v6

vertex

E1

v3

v5

Problem: Given a closed 2D polygon, fill its interior with a

specified color, on a graphics display

and simply connected, i.e. without holes

Solutions:

Flood fill

Scan Conversion

Let P be a polygon with n vertices, v0 .. vn-1

Denote vn=v0

Let c be a color to paint P

Let p=(x,y) be a point in P

FloodFill(P,x,y,c)

if (OnBoundary(x,y,P) or Colored (x,y,c))

then return;

else begin

PlotPixel(x,y,c);

FloodFill(P,x+1,y,c);

FloodFill(P,x,y+1,c);

FloodFill(P,x,y-1,c);

FloodFill(P,x-1,y,c);

end;

Fill Polygon

outside a polygon?

Let P be a polygon with n vertices, v0 .. vn-1

Denote vn=v0

Let c be a color to paint P

ScanConvert (P,c)

For j:=0 to ScreenYMax do

I := points of intersection of edges

from P with line y=j;

Sort I in increasing x order and fill

with color c alternating segments;

end;

Question: How do we find the intersecting edges?

Intersections at pixel coordinates

E

B

C

H

D

but not ymax vertices

Vertex B is counted once because ymin of (A,B)

Vertex E is not counted because ymax of both (D, E) and (E, F)

Vertex H is counted twice because ymin of both (G, H) and (H, I)

Uses a list of active edges A (edges currently intersecting the scan line)

ScanConvert(P,c)

Sort all edges E={Ej} in increasing MinY(Ej ) order.

A := ;

For k :=0 to ScreenYMax do

For each Ej E,

if MinY(Ej) k A := A Ej ; E=E- Ej

For each Ej A,

if MaxY(Ej) k A := A Ej

I:=Points of intersection of members

from A with line y=k;

Sort I in increasing x order and draw

with color c alternating segments;

end;

Implementation with linked lists

ymin

3 12

ymax

10

15

3 12

Flood Fill

Scan Conversion

Very simple.

More complex

Common in paint

packages

- Chapter23 Television[1]Uploaded byVictor Gomez Dy Lampadio
- How Television WorksUploaded byAlpesh Thesiya
- Ing Form - Infotech- Unit 20Uploaded byMoi Vilca
- Monitor RepairingUploaded byShahid Ali Lodhi
- menghitung luas tanah dengan excelUploaded byAgeng Rikhmawan
- Graphics LectureUploaded byNic
- Cse Mobile Phone Cloning PptUploaded byRejo george
- AKIRA 14THS3-CE (chassis UOC-OM8370).pdfUploaded byBiokid Totings
- lelm104Uploaded byGaurav Jaiswal
- hertzmann-siggraph98Uploaded bycalebarchon
- eyelashes.pdfUploaded byK.n.Ting
- 33276095 Schelling the Strategy of ConflictUploaded byCristian Romero
- 3dreadUploaded bygarisa1963
- c 0291722Uploaded byAJER JOURNAL
- 3D ComputerGraphics Lesson3 SimpleSourceCode 2006 22pgsUploaded bysilicongmaster7060
- Basic ElectronicsUploaded byRAHUL16398
- Adobe PhotoshopUploaded byIronman Manjarres Molina
- [2002] Japan_Graphics_Research.pdfUploaded byMark
- PetroCor BrochureUploaded bydedioded
- Tvpanasonictc 21fj30la 120719115335 Phpapp01Uploaded bylucian07
- BITS WASE ComputerGraphics Session 1Uploaded bySatyanarayan Reddy K
- computergraphiccoursesyllabusUploaded byapi-246809582
- GPU.docxUploaded bymajestic_dev
- C++ Game Part 4Uploaded bygracecannell
- drawingwithpaintUploaded byYani Palazzo
- 2222Uploaded bycont1122
- 79761Uploaded bysavignesh1
- 01 IntroductionUploaded byエバン スミド
- ArticlesUploaded byEmma
- V02-2554EN_DS_HDSP-Series_2015-10-09-909229Uploaded byManuel Eduardo Estrella Polanco

- Modified Systematic Approach to Answering QuestionsUploaded byromeofatima
- Effects of adequate equipments to studentsUploaded byromeofatima
- Pharmaceutical care and access to health information decisions involving minors.docxUploaded byromeofatima
- equipments.docUploaded byromeofatima
- Protein Rich and High Fatty FoodsUploaded byromeofatima
- SitesUploaded byromeofatima
- What is the HEIUploaded byromeofatima
- ScopusUploaded byromeofatima
- Research 2Uploaded byromeofatima
- Computerized System of Graduate Students of NPCMSTUploaded byromeofatima
- SGS_Medical Certificate Template.pdfUploaded byromeofatima
- Thesis Topics in PharmacyUploaded byromeofatima
- Computer Literacy ProgramUploaded byromeofatima
- Movie CriticUploaded byromeofatima
- Interview Guide QuestionUploaded byromeofatima
- RctUploaded byromeofatima
- Research GuidelinesUploaded byromeofatima
- Urine FormationUploaded byromeofatima
- Medicinal PlantsUploaded byromeofatima
- The Process of DyingUploaded byromeofatima
- AnthraxUploaded byromeofatima
- IT and IS booksUploaded byromeofatima
- Architectural COmponentsUploaded byromeofatima
- Advance Data ModelUploaded byromeofatima
- Photoshop TutorialUploaded byazkhaz
- Computer FundamentalsUploaded byromeofatima
- Microsoft Office BasicsUploaded byromeofatima
- Microsoft Office Basics LongUploaded byromeofatima

- CNN Features Off-The-shelf: An Astounding Baseline for RecognitionUploaded byAkash Gupta
- rbfMorphUploaded byHasrizam86
- Docslide.net 7750 Sr c12 Installation GuideUploaded byAndyMao
- INFORMATION THEORY AN CODINGUploaded bysakthivijayan80@yahoo.co.in
- It 6702 Data Warehousing and Data Mining Question BankUploaded bysudhakarm13
- Normalization StepsUploaded byAnubhav Gupta
- PowerBI Interview Questions and Answers.docxUploaded byexbis
- Digital McLogic DesignUploaded byneerajdhanraj
- sqlUploaded byAshwanandan Rao
- DLL QuestionsUploaded byVirenHeer
- 19. Control Builder User Guide for Ovation 3.5_OW350_80.pdfUploaded byEvbaru
- Chapter 1 Intro to CAD CAM CAEUploaded byMuhammad Hafiz
- MSP Design WorkshopUploaded byBouhafs Abdelkader
- Benchmark Framework PHPUploaded byqqqqqd
- defect predictionUploaded bykalshyam
- working with Disks and DevicesUploaded bybrokerichard53
- PDF MakerUploaded byAnonymous 1aCZDEbMM
- cisconetworkingacademystudentpackettracermanual-130507183356-phpapp01Uploaded byabeh
- Gamma3 Virtual Surgery-Description for Use OnlineUploaded byEveraldo Faria
- 2 - 1 - From Data Models to Databases (10-35)Uploaded byRahulsinghoooo
- Lab 4 Build and Deploy and IoT Application on BlueMixUploaded byDwane Almeida
- Manual Firewall Juniper SSG5 With AvayaUploaded byTxmrecr
- Enhanced Pid PideUploaded byyazid32
- etr_354e01pUploaded bySyed Muhmmad Faraz
- 4 76-f -y -b -sc-information-technology 2016-17Uploaded byapi-292680897
- XplorSeqUploaded bymarcos_de_carvalho
- Manual PLCUploaded byjuan
- Low Level DesignUploaded byPArdeep Gorla
- 1API.ai - IntroductionUploaded bySri Kondabattula