Bài giảng môn Đồ họa và hiện thực ảo - Bài 2: Các giải thuật sinh các thực thể cơ sở

z 2b is the length of the minor axis along the y axis.. z The midpoint can also be applied to ellipses.[r]

Các giải thuật sinh các thực thể

cơ sở

Le Tan Hung hunglt@it-hut.edu.vn 0913030731

Rendering Pipeline: 3-D

Transform Illuminate Transform Clip Project

Rasterize

Model & Camera Parameters Rendering Pipeline Framebuffer Display

The Rendering Pipeline: 3-D

Scene graph

Object geometry

Lighting

Calculations

Clipping

• Các điểm của hệ thống tọa độ 3D thế giới thực

• Các điểm bóng theo mô hình chiếu sáng

• Các điểm trong mô hình hệ tọa độ Camera hay tọa độ điểm nhìn

• Các tọa độ điểm của vùng hình chóp cụt với điểm nhìn xác định

• Điểm 2-D theo tọa độ màn hình sau phép chiếu được xén tỉa

Modeling

Transforms

Viewing

Transform

Projection

Transform

Phép biến đổi Transformations

zscreen space- không gian màn hình

zmodel space Không gian mô hình (a.k.a object space or world space)

z3 loại phép biến đổi:

– Modeling transforms

– Viewing transforms

– Projection transforms

Rendering: Transformations

zModeling transforms

– Size, place, scale, and rotate objects parts of the

model w.r.t each other

– Object coordinates Æ world coordinates

Z X Y

X Z

Y

Rendering: Transformations

zViewing transform

– Rotate & translate the world to lie directly in front of the camera

zTypically place camera at origin

zTypically looking down -Z axis

– World coordinates Æ view coordinates

Rendering: Transformations

zProjection transform

– Apply perspective foreshortening

zDistant = small: the pinhole cameramodel

– View coordinates Æ screen coordinates

Rendering: Transformations

zAll these transformations involve shifting coordinate systems (i.e., basis sets)

zOh yeah, that’s what matrices do…

zRepresent coordinates as vectors, transforms

as matrices

zMultiply matrices = concatenate transforms!

⎥

⎦

⎤

⎢

⎣

⎡

⎥

⎦

⎤

⎢

⎣

=

⎥

⎦

⎤

⎢

⎣

⎡

′

′

Y

X Y

X

θ θ

θ θ

cos sin

sin cos

Rendering: Transformations

zHomogeneous coordinates : represent

coordinates in 3 dimensions with a 4-vector

– Denoted [x, y, z, w]T

zNote that w = 1in model coordinates

– To get 3-D coordinates, divide by w :

[x’, y’, z’]T= [x/w, y/w, z/w]T

zTransformations are 4x4 matrices

zWhy? To handle translation and projection

The Rendering Pipeline: 3-D

Modeling Transforms

Scene graph Object geometry

Lighting Calculations Viewing Transform Clipping Projection Transform

Result:

• All vertices of scene in shared 3-D “world” coordinate system

• Vertices shaded according to lighting model

• Scene vertices in 3-D “view” or “camera” coordinate system

• Exactly those vertices & portions of polygons in view frustum

• 2-D screen coordinates of clipped vertices

Rendering: Ánh sáng - Lighting

zIlluminating a scene: coloring pixels according to

some approximation of lighting

– Global illumination : solves for lighting of the whole

scene at once

– Local illumination : local approximation, typically

lighting each polygon separately

zInteractive graphics (e.g., hardware) does only

local illumination at run time

The Rendering Pipeline: 3-D

Modeling Transforms

Scene graph Object geometry

Lighting Calculations Viewing Transform Clipping Projection Transform

Result:

•All vertices of scene in shared 3-D “world” coordinate system

•Vertices shaded according to lighting model

•Scene vertices in 3-D “view” or “camera” coordinate system

•Exactly those vertices & portions of polygons in view frustum

•2-D screen coordinates of clipped verticesD screen coordinates of clipped vertices

Rendering: Clipping

zClipping a 3-D primitive returns its intersection

with the view frustum :

Rendering: Xén tỉa - Clipping

zClipping is tricky!

– We will have a whole assignment on clipping

In: 3 vertices Out: 6 vertices Clip

Out: 2 polygons

The Rendering Pipeline: 3-D

Transform Illuminate Transform Clip Project Rasterize

Model & Camera

Parameters Rendering Pipeline Framebuffer Display

Modeling: The Basics

zCommon interactive 3-D primitives: points, lines, polygons (i.e., triangles)

zOrganized into objects

– Collection of primitives, other objects – Associated matrix for transformations

objects

– 4 wheels on a car, 2 arms on a robot

Modeling: The Scene Graph

zĐồ thị cảnh scene graph : cây đồ thị lưu trữ đối

tượng, quan hệ giũa các đối tượng và các phép

biến đổi trên đối tượng đó

zNút là đối tượng;

zCành là các thực thể biến đổi

– Tương ứng là các ma trận Robot

Body Head

Arm Trunk Leg Eye

Mouth

Modeling: The Scene Graph

zTraverse the scene graph in depth-first order, concatenating transformations

zMaintain a matrix stack of transformations

Arm Trunk Leg Eye Mouth

Robot

Foot

Matrix Stack

Visited Unvisited Active

Modeling: The Camera

zFinally: need a model of the virtual camera

– Can be very sophisticated

zField of view, depth of field, distortion, chromatic aberration…

– Interactive graphics (OpenGL):

zCamera pose: position & orientation

–Captured in viewing transform (i.e., modelview matrix)

zPinhole camera model

–Field of view

–Aspect ratio

–Near & far clipping planes

Modeling: The Camera

zCamera parameters (FOV, etc) are encapsulated

in a projection matrix

– Homogeneous coordinates Æ 4x4 matrix!

– See OpenGL Appendix F for the matrix

zThe projection matrix premultiplies the viewing matrix, which premultiplies the modeling matrices

– Actually, OpenGL lumps viewing and modeling transforms into modelview matrix

Rời rạc hoá điểm ảnh

(Scan Conversion rasterization)

z Là tiến trình sinh các đối tượng hình học cơ sở bằng

phương pháp xấp xỉ dựa trên lưới phân giải của màn

hình

z Tính chất các đối tượng cần đảm bảo :

– smooth

– continuous

– pass through specified points

– uniform brightness

– efficient

Biểu diễn đoạn thẳng

z Biểu diễn tường minh

(y-y1)/( x-x1) = ( y2-y1)/( x2-x1)1

y = kx + m

– k = (y2-y1)/( x2-x1)

– m = y1- kx1

– Δy = k Δx

z Biểu diễn không tường minh

(y2-y1)x - (x2-x1)y + x2y1 - x1y2 = 0 hay rx + sy + t = 0

– s = -(x2-x1 )

– r = (y2-y1) và t = x2y1 - x1y2

z Biểu diễn tham biến P(u) = P1 + u(P2 - P1)

u [0,1]

X = x1 + u( x2 - x1 )

Y = y1 + u( y2 - y1 )

m

P(x1, y1)

P(x2 , y2) u

Sinh đường tròn

Scan Converting Circles

z Implicit: f(x) = x2+y2-R2

z Explicit: y = f(x)

z Parametric:

y = ± R − x

cos sin

x R

y R

θ θ

=

=

If f(x,y) = 0 then it is on the circle

f(x,y) > 0 then it is outside the circle

f(x,y) < 0 then it is inside the circle

Usually, we draw a quarter circle by

incrementing x from 0 to R in unit steps

and solving for +y for each step

- by stepping the angle from 0 to 90

- avoids large gaps but still insufficient

Thuật toán DDA (Digital Differential Analizer)

Giải thuật DDA

z Với 0 < k < 1

xi+1= xi+ 1

yi+1 = yi+ k với i=1,2,3

Thuậttoán ddaline (x1, y1, x2, y2) x1, y1, x2, y2 : tọa độ 2 điểm đầu cuối

k : hệ số góc x,y,m :biến begin

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

x = x1;

k = 1/m;

putpixel(x,y);

while x<x2 begin

x = x+1;

y = y+k;

putpixel(round(x),round(y));

Giải thuật thông thường DrawLine(int x1,int y1, int x2,int y2, int color)

{ float y;

int x;

for (x=x1; x<=x2; x++) {

y = y1 + (x-x1)*(y2-y1)/(x2-x1) WritePixel(x, Round(y), color );

}}

Giải thuật Bresenham

z 1960 Bresenham thuộc

IBM

z điểm gần với đường thẳng

dựa trên độ phân giai hưu

hạn

z loại bỏ được các phép toán

chia và phép toán làm tròn

như ta đã thấy trong gỉai

thuật DDA

z Xét đoạn thẳng với 0 < k < 1 0 1 2

0 1

d1

Giải thuật Bresenham

d2= y - yi = k(xi +1) + b - yi

d1= yi+1 y = yi + 1 k(xi + 1) -b

z If d1≤ d2=> yi+1= yi + 1 else d1 > d2=> yi+1= yi

z D = d1- d2

= -2k(xi + 1) + 2yi - 2b + 1

z Pi = ΔxD = Δx (d1- d2)

d1 d2

xi x

i+1

yi

yi+1

Pi = -2Δyxi + 2Δxyi + c

Pi+1- Pi

= -2Δy(xi+1- xi) + 2Δx(yi+1- yi)

z Nếu Pi ≤ 0 ⇒ yi+1= yi + 1

Pi+1= Pi - 2Δy + 2Δx

z Nếu Pi > 0 ⇒ yi+1= yi

Pi+1= Pi - 2Δy

P1= Δx(d1- d2)

P1= -2Δy + Δx

Giải thuật Bresenham

y i+1

M ( x i , y i )

Giải thuật trung điểm-Midpoint

z Jack Bresenham 1965 / Pitteway 1967

z VanAken áp dụng cho việc sinh các đường thẳng và đường tròn 1985

z Các công thức đơn giản hơn, tạo được các điểm tương tự như với Bresenham

z d = F (xi + 1, yi + 1/2) là trung điểm của đoạn AB

z Việc so sánh, hay kiểm tra M sẽ được thay bằng việc xét giá trị d

– Nếu d > 0 điểm B được chọn, yi+1= yi – nếu d < 0 điểm A được chọn ⇒ yi+1= yi+ 1

– Trong trường hợp d = 0 chúng ta có thể chọn điểm bất kỳ hoặc A, hoặc B

A M B

Bresenham’s Algorithm: Midpoint

Algorithm

z Sử dụng phương pháp biểu diễn không tường minh

z Tại mỗi trung điểm của đoạn thẳng giá trị được tính

là:

zChúng ta gọi dilà biến quyết định của bước thứ i

0

= + + by c ax

i i

i i i

i

i i i

i

y x c by ax

y x c by ax

y x c by ax

, 0 , 0 , 0

⇒

>

+ +

⇒

<

+ +

⇒

= +

above line below line

a

⎠

⎞

⎜

⎝

⎛ + + +

=

2

1 1

Bresenham’s Algorithm: Midpoint Algorithm

z If d i > 0then chọn điểm A⇒ trung điểm tiếp theo sẽ có dạng:

b a d

c y b x a d y

x

i

i i i i

i

+ +

=

+

⎟

⎠

⎞

⎜

⎝

⎛ + + +

=

⇒

⎟

⎠

⎞

⎜

⎝

+

2

3 2 2

3 ,

Bresenham’s Algorithm: Midpoint

Algorithm

z if d i < 0then chọn điểm B và trung điểm mới là

z Ta có:

z Ðiểm đầu

2 2

1 1

2

1 ,

1

b a c by ax

c y b x d y

x

start start

start start

start start

start

+ + + +

=

+

⎟

+ +

=

⇒

⎟

a d

c y b x a d y

x

i

i i i i

i

+

=

+

⎟

⎜

⎛ + + +

=

⇒

⎟

2

1 2

2

1 ,

C x y x

C c

x x x b

y y y a

start end start end

+ Δ

Δ

=

⎪

⎪

⎫ Δ

=

−

= Δ

−

−

= Δ

=

where

2

0+a+b

=

Midpoint Line Algorithm

dx = x_end-x_start

dy = y_end-y_start

d = 2*dy-dx

x = x_start

y = y_start while x < x_end

if d <= 0 then

d = d+(2*dy)

x = x+1 else

d = d+2*(dy-dx)

x = x+1

y = y+1 endif SetPixel(x,y) endwhile

initialisation

choose B

choose A

Giải thuật

Bresenham's Midpoint

z d = a(xi + 1) + b(yi + 1/2) + c

z Nếu điểm được chọn là B thi M sẽ tang

theo x một đơn vị

= a(xi +2) + b(yi + 1/2) + c

z Nếu điểm A được chọn thi` M tăng theo

2 hướng x và y với cùng một đơn vị

di+ 1 = F (xi + 2, yi + 3/2)

– = a(xi + 2) + b(yi +3/2) + c

– di+ 1= di + a + b

¾ Với a + b = dy - dx

d <= 0

B¾t ®Çu

x = x1 ;

y = y1;

dx = x2 - x1;

d = dy - dx/2;

Putpixel (x ,y);

x < x2

KÕt thóc

d = d + dy

d = d + dy - dx

y = y + 1

yes

no

No

yes

x = x + 1

Midpoint Circle Algorithm

z Sử dụng phương pháp biểu diễn không tường minh trong giải thuật

z Thực hiện giải thuật trên 1/8 đường tròn và lấy đối xứng xho các góc còn lại

z Với d ilà giá trị của đường tròn tại một điểm bất kỳ ta có

( x − xc) (2+ y − yc)2− r2= 0

( , )isoutsidecircle if

circle

on is , if

circle inside is , if

⎪

⎪

>

=

<

=

i i i i i i i

y x y x y x d

Midpoint Circle Algorithm

z As with the line, we determine the value of the decision variable

by substituting the mid-point of the next pixel into the implicit

form of the circle:

z If d i< 0 we choose pixel A otherwise we choose pixel B

– Note: we currently assume the circle is centered at the origin

2 2

2

1

x

di= i+ + ⎜ ⎛ −i ⎟ −

Midpoint Circle Algorithm

z Again, as with the line algorithm, the choice of A or B can be

used to determine the new value of d i+1

z If A chosen then next midpoint has the following decision

variable:

z Otherwise if B is chosen then the next decision variable is given

by:

3 2 2

1 2 2

1 ,

2 2

1

+ +

=

−

⎟

⎜

⎛ − + +

=

⇒

⎟

i i

i i i i

i

x d

r y x d y

x

5 2 2 2

3 2 2

3 ,

2 2 1

+

− +

=

−

⎟

⎜

⎛ − + +

=

⇒

⎟

i i i

i i i i

i

y x d

r y x d y

x

Midpoint Circle Algorithm

z If we assume that the radius is an integral value, then the first

pixel drawn is (0, r) and the initial value for the decision variable

is given by:

z Although the initial value is fractional, we note that all other

values are integers.

⇒ we can round down:

r

r r r d r

−

=

−

⎟

⎠

⎞

⎜

⎝

+

=

⇒

⎟

⎠

⎞

⎜

⎝

4 5

4

1 1

2

1 ,

0

r

d0=1 −

Midpoint Circle Algorithm

d = 1-r

x = 0

y = r while y < x

if d < 0 then

d = d+2*x+3

x = x+1 else

d = d+2*(x-y)+5

x = x+1

y = y-1 endif SetPixel(c x +x,c y +y) endwhile

initialisation

choose B choose A

Translate to the circle center stop at diagonal ⇒ end of octant

Scan Converting Ellipses

z 2a is the length of the major axis along the x axis.

z 2b is the length of the minor axis along the y axis.

z The midpoint can also be applied to ellipses.

z For simplicity, we draw only the arc of the ellipse that

lies in the first quadrant, the other three quadrants can

be drawn by symmetry

F x y = b x + a y − a b =

Scan Converting Ellipses: Algorithm

z Firstly we divide the quadrant into two regions

z Boundary between the two regions is

– the point at which the curve has a slope of -1

– the point at which the gradient vector has the i and j components of equal magnitude

grad F x y =∂ ∂ +∂ ∂ = F x i F y j b x i + a y j

A

M tiep tuyen = -1

B gradient

B C M

i

Ellipses: Algorithm (cont.)

z At the next midpoint, if a 2 (y p -0.5)<=b 2 (x p +1), we switch region 1=>2

z In region 1, choices are E and SE

– Initial condition: dinit= b2+a2(-b+0.25)

– For a move to E, dnew= dold+DeltaEwith DeltaE= b2(2xp+3)

– For a move to SE, dnew= dold+DeltaSEwith

DeltaSE= b2(2xp+3)+a2(-2yp+2)

z In region 2, choices are S and SE

– Initial condition: dinit= b2(xp+0.5)2+a2((y-1)2-b2)

– For a move to S, dnew= dold+Deltaswith Deltas= a2(-2yp+3)

– For a move to SE, dnew= dold+DeltaSEwith

DeltaSE= b2(2xp+2)+a2(-2yp+3)

z Stop in region 2 when the y value is zero

Ký tự Bitmap

z Trên cơ sỏ định nghĩa mỗi ký tự với một font chư cho trước là một bitmap chữ nhật nhỏ

z Font/typeface: set of character shapes

z fontcache – các ký tự theo chuỗi liên tiếp nhau trong bộ nhớ

z Dạng cơ bản – (thường N, nghiêng I, đậm B, nghiêng đậm B+I)

z Thuộc tính – Also colour, size, spacing and orientation

ab