Buffers and Mappings Ar.Gör.Cengiz Güngör [email protected] UBI 516 Advanced Computer...

Buffers and Mappings

Ar.Gör.Cengiz GüngörAr.Gör.Cengiz Güngör

[email protected]@ube.ege.edu.tr

UBI 516 Advanced Computer Graphics

UBI 516 Advanced Computer Graphics

Vector Vector ddisplaysisplays

• Anybody remember Anybody remember BattlezoneBattlezone? ? TempestTempest? ?

Historical Background


1970 : 1970 : LLocal illumination modelsocal illumination models

• Phong shading : Phong shading : PPlastic lastic modelsmodels

1980 : 1980 : Computer Computer realismrealism, ,

PCs and home computersPCs and home computers

• GGlobal illumination modelslobal illumination models

– HHigh cost, but very realisticigh cost, but very realistic

• TTexture mappingexture mapping

– LLow cost, but reasonable resultsow cost, but reasonable results

1970 : 1970 : LLocal illumination modelsocal illumination models

• Phong shading : Phong shading : PPlastic lastic modelsmodels

1980 : 1980 : Computer Computer realismrealism, ,

PCs and home computersPCs and home computers

• GGlobal illumination modelslobal illumination models

– HHigh cost, but very realisticigh cost, but very realistic

• TTexture mappingexture mapping

– LLow cost, but reasonable resultsow cost, but reasonable results


Until past decade application programmers have Until past decade application programmers have had only indirect access to the frame buffer.had only indirect access to the frame buffer.

TodayToday : : Texture mapping, antialiasing, Texture mapping, antialiasing, compositing and alpha blending are only a few compositing and alpha blending are only a few of the techniques that become possibble when of the techniques that become possibble when the API (OpenGL) allows us to work with the API (OpenGL) allows us to work with discrete buffers.discrete buffers.

Until past decade application programmers have Until past decade application programmers have had only indirect access to the frame buffer.had only indirect access to the frame buffer.

TodayToday : : Texture mapping, antialiasing, Texture mapping, antialiasing, compositing and alpha blending are only a few compositing and alpha blending are only a few of the techniques that become possibble when of the techniques that become possibble when the API (OpenGL) allows us to work with the API (OpenGL) allows us to work with discrete buffers.discrete buffers.

Buffers and Mappings

Buffers

We have already used two types of standart buffers:We have already used two types of standart buffers:

• Color buffers and depth buffers. Color buffers and depth buffers.

AA block of memory block of memory

• nn × × m m ×× k k bit elements bit elements

BBit planeit plane

• AAny of the ny of the k nk n × × mm planes planes in a bufferin a buffer

PPixelixel

• AAll ll kk of the elements at a position of the elements at a position

We have already used two types of standart buffers:We have already used two types of standart buffers:

• Color buffers and depth buffers. Color buffers and depth buffers.

AA block of memory block of memory

• nn × × m m ×× k k bit elements bit elements

BBit planeit plane

• AAny of the ny of the k nk n × × mm planes planes in a bufferin a buffer

PPixelixel

• AAll ll kk of the elements at a position of the elements at a position

pixel 1

bit plane 1

OpenGL Buffers

OpenGL Buffers and the Pixel Pipeline

CColor buffersolor buffers (including frame buffer)(including frame buffer)

• DDouble buffering :ouble buffering : front / back buffersfront / back buffers

• SStereo buffering :tereo buffering : right / left buffersright / left buffers

DDepth bufferepth buffer (= Z-buffer)(= Z-buffer)

FFor hidden-surface removalor hidden-surface removal

AAccumulation bufferccumulation buffer SStencil buffertencil buffer

MMotion blur, anti-aliasingotion blur, anti-aliasing UUsed for maskingsed for maskingoperationoperation

CColor buffersolor buffers (including frame buffer)(including frame buffer)

• DDouble buffering :ouble buffering : front / back buffersfront / back buffers

• SStereo buffering :tereo buffering : right / left buffersright / left buffers

DDepth bufferepth buffer (= Z-buffer)(= Z-buffer)

FFor hidden-surface removalor hidden-surface removal

AAccumulation bufferccumulation buffer SStencil buffertencil buffer

MMotion blur, anti-aliasingotion blur, anti-aliasing UUsed for maskingsed for maskingoperationoperation

Read from / Write into Buffers

In a modern graphics system, a user program can both write into In a modern graphics system, a user program can both write into and read from the buffers.and read from the buffers.

• We occasionally want to read or write a We occasionally want to read or write a single pixel single pixel or bit. or bit.

• Rather, we tend to read and write rectangular blocks of pixels (or bits), Rather, we tend to read and write rectangular blocks of pixels (or bits), known as bit blocks.known as bit blocks.

– bit-bltbit-blt (bit-block transfer) (bit-block transfer) = raster-ops, raster operations= raster-ops, raster operations

• GGeometric eometric object object operationoperations is different pixel operations.s is different pixel operations.

– OpenGL contains both a geometric pipeline and a pixel pipeline. OpenGL contains both a geometric pipeline and a pixel pipeline.

In a modern graphics system, a user program can both write into In a modern graphics system, a user program can both write into and read from the buffers.and read from the buffers.

• We occasionally want to read or write a We occasionally want to read or write a single pixel single pixel or bit. or bit.

• Rather, we tend to read and write rectangular blocks of pixels (or bits), Rather, we tend to read and write rectangular blocks of pixels (or bits), known as bit blocks.known as bit blocks.

– bit-bltbit-blt (bit-block transfer) (bit-block transfer) = raster-ops, raster operations= raster-ops, raster operations

• GGeometric eometric object object operationoperations is different pixel operations.s is different pixel operations.

– OpenGL contains both a geometric pipeline and a pixel pipeline. OpenGL contains both a geometric pipeline and a pixel pipeline.

write_block( source, n, m, x, y, destination, u, v ); Source is at (x,y), Destination is at (u,v),Operation writes m × n bit-block.

Pixel Pipeline

OpenGL support a seperate pixel pipeline and a variety of OpenGL support a seperate pixel pipeline and a variety of buffers.buffers.

Data can be moved among these buffers.Data can be moved among these buffers.

And data can be moved between buffers and memory.And data can be moved between buffers and memory.

There are 16 operations for data transfer.There are 16 operations for data transfer.

OpenGL support a seperate pixel pipeline and a variety of OpenGL support a seperate pixel pipeline and a variety of buffers.buffers.

Data can be moved among these buffers.Data can be moved among these buffers.

And data can be moved between buffers and memory.And data can be moved between buffers and memory.

There are 16 operations for data transfer.There are 16 operations for data transfer.

Writing ModesSSource ource DDestination estination writingwriting operation operation has has

• 16 16 different different modesmodes

Using modes :Using modes :

• mode 3:mode 3: copycopydest dest source source

• mode 7:mode 7: logical ORlogical ORdest dest source + dest source + dest

• mode 6:mode 6: XORXORdest dest source source dest dest

SSource ource DDestination estination writingwriting operation operation has has

• 16 16 different different modesmodes

Using modes :Using modes :

• mode 3:mode 3: copycopydest dest source source

• mode 7:mode 7: logical ORlogical ORdest dest source + dest source + dest

• mode 6:mode 6: XORXORdest dest source source dest dest

d’

XOR modemode 6 : mode 6 : twice twice XORXOR operation returns the original pixel. operation returns the original pixel.

• ((xx yy) ) yy = = xx

If we use menus :If we use menus :

• A menu appears when mA menu appears when mouseouse clicked, clicked,

• And area of screen that it covered, must be returned orginal state when And area of screen that it covered, must be returned orginal state when menu disappeares.menu disappeares.

• S : frame buffer, M : back buffer (backing storage)S : frame buffer, M : back buffer (backing storage)

SS11 S S00 M M00 (S(S1 1 is xored back buffer)is xored back buffer)

MM11 S S11 M M00 = (S = (S00 M M00) ) M M00 = = SS00

SS22 S S11 M M11 = (S = (S00 M M00) ) M M11 = (S = (S00 M M00) ) S S00 = = MM00

mode 6 : mode 6 : twice twice XORXOR operation returns the original pixel. operation returns the original pixel.

• ((xx yy) ) yy = = xx

If we use menus :If we use menus :

• A menu appears when mA menu appears when mouseouse clicked, clicked,

• And area of screen that it covered, must be returned orginal state when And area of screen that it covered, must be returned orginal state when menu disappeares.menu disappeares.

• S : frame buffer, M : back buffer (backing storage)S : frame buffer, M : back buffer (backing storage)

SS11 S S00 M M00 (S(S1 1 is xored back buffer)is xored back buffer)

MM11 S S11 M M00 = (S = (S00 M M00) ) M M00 = = SS00

SS22 S S11 M M11 = (S = (S00 M M00) ) M M11 = (S = (S00 M M00) ) S S00 = = MM00

Pixels and Images in OpenGL

RRead, draw, copy ead, draw, copy operations start at operations start at raster position raster position

void glReadPixels( GLint x, GLint y, GLsizei width, GLsizei height, GLenum format, GLenum type, GLvoid* pixels );

void glDrawPixels( GLsizei width, GLsizei height, GLenum format, GLenum type, const GLvoid* pixels );

void glCopyPixels( GLint x, GLint y, GLsizei width, GLsizei height, GLenum type );

RRead, draw, copy ead, draw, copy operations start at operations start at raster position raster position

void glReadPixels( GLint x, GLint y, GLsizei width, GLsizei height, GLenum format, GLenum type, GLvoid* pixels );

void glDrawPixels( GLsizei width, GLsizei height, GLenum format, GLenum type, const GLvoid* pixels );

void glCopyPixels( GLint x, GLint y, GLsizei width, GLsizei height, GLenum type );

Mapping Methods

One of the most powerful uses of buffers is for One of the most powerful uses of buffers is for surface rendering.surface rendering.

• Texture mappingTexture mapping : : Surface patterns. In the real world, Surface patterns. In the real world,we can distinguish among object of similar size and we can distinguish among object of similar size and shape by their textures. It can be 1,2,3 or 4 dimensional.shape by their textures. It can be 1,2,3 or 4 dimensional.

• Bump mappingBump mapping : Distort of normal vectors like an : Distort of normal vectors like an orange object.orange object.

• Environment mappingEnvironment mapping : Reflections. : Reflections.

One of the most powerful uses of buffers is for One of the most powerful uses of buffers is for surface rendering.surface rendering.

• Texture mappingTexture mapping : : Surface patterns. In the real world, Surface patterns. In the real world,we can distinguish among object of similar size and we can distinguish among object of similar size and shape by their textures. It can be 1,2,3 or 4 dimensional.shape by their textures. It can be 1,2,3 or 4 dimensional.

• Bump mappingBump mapping : Distort of normal vectors like an : Distort of normal vectors like an orange object.orange object.

• Environment mappingEnvironment mapping : Reflections. : Reflections.

Texture Mapping

Two-Dimensional Texture Mapping

TTexture space (exture space (ss, , tt) :) : I Imagemage [0,1] × [0,1][0,1] × [0,1]

• TTexelexel : : TTexture element. pixel in the textureexture element. pixel in the texture

OObject space (bject space (xxww, , yyww, , zzww) ) is is 33 dimensionaldimensional

SScreen space (creen space (xxss, , yyss) ) is is 22DD

TTexture space (exture space (ss, , tt) :) : I Imagemage [0,1] × [0,1][0,1] × [0,1]

• TTexelexel : : TTexture element. pixel in the textureexture element. pixel in the texture

OObject space (bject space (xxww, , yyww, , zzww) ) is is 33 dimensionaldimensional

SScreen space (creen space (xxss, , yyss) ) is is 22DD

Texture Mapping Methodstexture space

(s, t)object space(xw, yw, zw)

screen space(xs, ys)

forward mapping

backward mappingpixels

texture space

Example of Texture Mapping


glVertex3d (s, s, s)glTexCoord2d(5, 5);

glVertex3d (s, s, s)glTexCoord2d(1, 1);

The Art of 3D Computer Animation and Effects by Isaac Kerlow

Texture Mapping

MMapping from texture space to object spaceapping from texture space to object space

• LLinear mapping for a parametric surfaceinear mapping for a parametric surface

• LLinear mapping function: (inear mapping function: (s,ts,t) ) ( (u,vu,v) )

– uu = = ffuu((s,ts,t) = ) = a sa s + + b tb t + + cc

– vv = = f fvv((s,ts,t) = ) = d sd s + + e te t + + f f

• IInvertible mapping when nvertible mapping when a ea e b db d

MMapping from texture space to object spaceapping from texture space to object space

• LLinear mapping for a parametric surfaceinear mapping for a parametric surface

• LLinear mapping function: (inear mapping function: (s,ts,t) ) ( (u,vu,v) )

– uu = = ffuu((s,ts,t) = ) = a sa s + + b tb t + + cc

– vv = = f fvv((s,ts,t) = ) = d sd s + + e te t + + f f

• IInvertible mapping when nvertible mapping when a ea e b db d

)(

)(

minmaxminmax

minmin

minmaxminmax

minmin

vvtt

ttvv

uuss

ssuu

Two-part texture mapping

Bier and Sloan, “Bier and Sloan, “Two-part texture mappingTwo-part texture mapping”, ”, IEEE CG&AIEEE CG&A, 6(9), 1986., 6(9), 1986.

First step maps the texture to a simple three-dimensional First step maps the texture to a simple three-dimensional intermediate surfaceintermediate surface, such as sphere, cylinder or cube., such as sphere, cylinder or cube.

• 2D texture2D texture

– 2D 2D simple 3D simple 3D mapping mapping

Second, Second, 3D intermediate surface3D intermediate surface mapped to object mapped to object surface.surface.

• SSimple 3D imple 3D complex 3D complex 3D mapping mapping

• 3D object3D object (maybe complex)(maybe complex)

Bier and Sloan, “Bier and Sloan, “Two-part texture mappingTwo-part texture mapping”, ”, IEEE CG&AIEEE CG&A, 6(9), 1986., 6(9), 1986.

First step maps the texture to a simple three-dimensional First step maps the texture to a simple three-dimensional intermediate surfaceintermediate surface, such as sphere, cylinder or cube., such as sphere, cylinder or cube.

• 2D texture2D texture

– 2D 2D simple 3D simple 3D mapping mapping

Second, Second, 3D intermediate surface3D intermediate surface mapped to object mapped to object surface.surface.

• SSimple 3D imple 3D complex 3D complex 3D mapping mapping

• 3D object3D object (maybe complex)(maybe complex)


TTwo-stage forward mappingwo-stage forward mapping• SS mapping mapping (surface mapping)(surface mapping)

– TT((uu, , vv) ) TT’’((xxii, , yyii, , zzii) : intermediate surface) : intermediate surface

• OO mapping mapping (object mapping)(object mapping)

– TT’’((xxii, , yyii, , zzii) ) OO((xxww, , yyww, , zzww))

intermediate surface : plane, cylinder, cube, sphereintermediate surface : plane, cylinder, cube, sphere

TTwo-stage forward mappingwo-stage forward mapping• SS mapping mapping (surface mapping)(surface mapping)

– TT((uu, , vv) ) TT’’((xxii, , yyii, , zzii) : intermediate surface) : intermediate surface

• OO mapping mapping (object mapping)(object mapping)

– TT’’((xxii, , yyii, , zzii) ) OO((xxww, , yyww, , zzww))

intermediate surface : plane, cylinder, cube, sphereintermediate surface : plane, cylinder, cube, sphere

cylinder 의 경우 cube 의 경우


S and S and OO mapping mapping S and S and OO mapping mapping

texture

S mapping O mapping

Using object normals

Rays from centerof object

Using intermediate object normals

Texture Mapping in OpenGL

OpenGL OpenGL textures textures

• FFrom one- or two-dimensional texturerom one- or two-dimensional texture

• TTo 1D, 2D, 3D, 4D objecto 1D, 2D, 3D, 4D object

• 2D texture to 3D object2D texture to 3D object

OpenGL OpenGL textures textures

• FFrom one- or two-dimensional texturerom one- or two-dimensional texture

• TTo 1D, 2D, 3D, 4D objecto 1D, 2D, 3D, 4D object

• 2D texture to 3D object2D texture to 3D object

glTexImage2D(…)

void void glTexImage2DglTexImage2D((GLenum target,GLenum target, GL_TEXTURE_2D: target texture bufferGLint level,GLint level, 0, 1, 2, …: level-of-detail for Mip-MapGLint components,GLint components, 0, 1, 2, 3 : componentsGLsizei width,GLsizei width, width of textureGLsizei height,GLsizei height, height of textureGLint border,GLint border, 0 : border widthGLenum format,GLenum format, color format of pixels (R, G, B, A)GLenum type,GLenum type, type of pixel data (int, short, long, …)const GLvoid* pixelsconst GLvoid* pixels source color array););

void void glTexImage2DglTexImage2D((GLenum target,GLenum target, GL_TEXTURE_2D: target texture bufferGLint level,GLint level, 0, 1, 2, …: level-of-detail for Mip-MapGLint components,GLint components, 0, 1, 2, 3 : componentsGLsizei width,GLsizei width, width of textureGLsizei height,GLsizei height, height of textureGLint border,GLint border, 0 : border widthGLenum format,GLenum format, color format of pixels (R, G, B, A)GLenum type,GLenum type, type of pixel data (int, short, long, …)const GLvoid* pixelsconst GLvoid* pixels source color array););

glTexImage2D – Arg 1

GLenum targetGLenum target• GL_TEXTURE_2DGL_TEXTURE_2D

• GL_PROXY_TEXTURE_2DGL_PROXY_TEXTURE_2D

– Provides queries for texture resourcesProvides queries for texture resources

– Proceed with hypothetical texture use (GL won’t Proceed with hypothetical texture use (GL won’t apply the texture)apply the texture)

– After query, call GLGetTexLevelParamter to verify presence After query, call GLGetTexLevelParamter to verify presence of required system componentsof required system components

– Doesn’t check possibility of multiple texture Doesn’t check possibility of multiple texture interferenceinterference

GLenum targetGLenum target• GL_TEXTURE_2DGL_TEXTURE_2D

• GL_PROXY_TEXTURE_2DGL_PROXY_TEXTURE_2D

– Provides queries for texture resourcesProvides queries for texture resources

– Proceed with hypothetical texture use (GL won’t Proceed with hypothetical texture use (GL won’t apply the texture)apply the texture)

– After query, call GLGetTexLevelParamter to verify presence After query, call GLGetTexLevelParamter to verify presence of required system componentsof required system components

– Doesn’t check possibility of multiple texture Doesn’t check possibility of multiple texture interferenceinterference


GLint levelGLint level• Used for Level of Detail (LOD)Used for Level of Detail (LOD)

• LOD stores multiple versions of texture that can beLOD stores multiple versions of texture that can be used at used at runtime (set of sizes)runtime (set of sizes)

• Runtime algorithms select appropriate version of textureRuntime algorithms select appropriate version of texture

– Pixel size of polygon used to select best texturePixel size of polygon used to select best texture

– Eliminates need for error-prone filtering algorithmsEliminates need for error-prone filtering algorithms

GLint levelGLint level• Used for Level of Detail (LOD)Used for Level of Detail (LOD)

• LOD stores multiple versions of texture that can beLOD stores multiple versions of texture that can be used at used at runtime (set of sizes)runtime (set of sizes)

• Runtime algorithms select appropriate version of textureRuntime algorithms select appropriate version of texture

– Pixel size of polygon used to select best texturePixel size of polygon used to select best texture

– Eliminates need for error-prone filtering algorithmsEliminates need for error-prone filtering algorithms


GLint internalFormatGLint internalFormat• Describes which of R, G, B, and A are used in internal Describes which of R, G, B, and A are used in internal

representation of texelsrepresentation of texels

• Provides control over things texture can doProvides control over things texture can do

– High bit depth alpha blendingHigh bit depth alpha blending

– High bit depth intensity mappingHigh bit depth intensity mapping

– General purpose RGBGeneral purpose RGB

• GL doesn’t guarantee all options are available on given GL doesn’t guarantee all options are available on given hardwarehardware

GLint internalFormatGLint internalFormat• Describes which of R, G, B, and A are used in internal Describes which of R, G, B, and A are used in internal

representation of texelsrepresentation of texels

• Provides control over things texture can doProvides control over things texture can do

– High bit depth alpha blendingHigh bit depth alpha blending

– High bit depth intensity mappingHigh bit depth intensity mapping

– General purpose RGBGeneral purpose RGB

• GL doesn’t guarantee all options are available on given GL doesn’t guarantee all options are available on given hardwarehardware

glTexImage2D – Args 4-6

GLsizei widthGLsizei width, , GLsizei heightGLsizei height• Dimensions of texture imageDimensions of texture image

– Must be 2Must be 2mm + 2b (b=0 or 1 depending on border) + 2b (b=0 or 1 depending on border)

– min, 64 x 64min, 64 x 64

GLint borderGLint border• Width of border (1 or 0)Width of border (1 or 0)

– Border allows linear blending between overlapping Border allows linear blending between overlapping texturestextures

– Useful when manually tiling texturesUseful when manually tiling textures

GLsizei widthGLsizei width, , GLsizei heightGLsizei height• Dimensions of texture imageDimensions of texture image

– Must be 2Must be 2mm + 2b (b=0 or 1 depending on border) + 2b (b=0 or 1 depending on border)

– min, 64 x 64min, 64 x 64

GLint borderGLint border• Width of border (1 or 0)Width of border (1 or 0)

– Border allows linear blending between overlapping Border allows linear blending between overlapping texturestextures

– Useful when manually tiling texturesUseful when manually tiling textures

glTexImage2D – Args 7-9

GLenum formatGLenum format

• Describe how texture data is stored in input arrayDescribe how texture data is stored in input array

– GL_RGB, GL_RGBA, GL_BLUE…GL_RGB, GL_RGBA, GL_BLUE…

GLenum type GLenum type

• Data size of array componentsData size of array components

– GL_SHORT, GL_BYTE, GL_INT…GL_SHORT, GL_BYTE, GL_INT…

Const GLvoid *texelsConst GLvoid *texels

• Pointer to data describing texture mapPointer to data describing texture map

GLenum formatGLenum format

• Describe how texture data is stored in input arrayDescribe how texture data is stored in input array

– GL_RGB, GL_RGBA, GL_BLUE…GL_RGB, GL_RGBA, GL_BLUE…

GLenum type GLenum type

• Data size of array componentsData size of array components

– GL_SHORT, GL_BYTE, GL_INT…GL_SHORT, GL_BYTE, GL_INT…

Const GLvoid *texelsConst GLvoid *texels

• Pointer to data describing texture mapPointer to data describing texture map

glGetTexImage(…)

void void glGetTexImageglGetTexImage((GLenum GLenum targettarget,, GL_TEXTURE_2D: target texture bufferGLint GLint levellevel,, 0, 1, 2, …: level-of-detail for Mip-MapGLenum GLenum formatformat,, color format of pixels (R, G, B, A)GLenum GLenum typetype,, type of pixel data (int, short, long, …)GLvoid* GLvoid* pixelspixels texture buffer););

void void glGetTexImageglGetTexImage((GLenum GLenum targettarget,, GL_TEXTURE_2D: target texture bufferGLint GLint levellevel,, 0, 1, 2, …: level-of-detail for Mip-MapGLenum GLenum formatformat,, color format of pixels (R, G, B, A)GLenum GLenum typetype,, type of pixel data (int, short, long, …)GLvoid* GLvoid* pixelspixels texture buffer););


In display() function :In display() function :glEnable(GL_TEXTURE_2D);glEnable(GL_TEXTURE_2D);glBegin(GL_QUADglBegin(GL_QUADSS););

glTexCoord2f(0.0, 0.0);glTexCoord2f(0.0, 0.0);glVertex2f(x1, y1, z1);glVertex2f(x1, y1, z1);glTexCoord2f(1.0, 0.0);glTexCoord2f(1.0, 0.0);glVertex2f(x2, y2, z2);glVertex2f(x2, y2, z2);glTexCoord2f(1.0, 1.0);glTexCoord2f(1.0, 1.0);glVertex2f(x3, y3, z3);glVertex2f(x3, y3, z3);glTexCoord2f(0.0, 1.0);glTexCoord2f(0.0, 1.0);glVertex3f(x4, y4, z4);glVertex3f(x4, y4, z4);

glEnd( );glEnd( );

In display() function :In display() function :glEnable(GL_TEXTURE_2D);glEnable(GL_TEXTURE_2D);glBegin(GL_QUADglBegin(GL_QUADSS););

glTexCoord2f(0.0, 0.0);glTexCoord2f(0.0, 0.0);glVertex2f(x1, y1, z1);glVertex2f(x1, y1, z1);glTexCoord2f(1.0, 0.0);glTexCoord2f(1.0, 0.0);glVertex2f(x2, y2, z2);glVertex2f(x2, y2, z2);glTexCoord2f(1.0, 1.0);glTexCoord2f(1.0, 1.0);glVertex2f(x3, y3, z3);glVertex2f(x3, y3, z3);glTexCoord2f(0.0, 1.0);glTexCoord2f(0.0, 1.0);glVertex3f(x4, y4, z4);glVertex3f(x4, y4, z4);

glEnd( );glEnd( );

Repeat or Clamp

FirstFirst problem is what happens if we specify a problem is what happens if we specify a value of s & t outside the range (0.0, 1.0).value of s & t outside the range (0.0, 1.0).

• Values below this interval cause the texture to repeat.Values below this interval cause the texture to repeat.

• Values above this interval cause the texture to clamp.Values above this interval cause the texture to clamp.

For repeated textures we:For repeated textures we:

glTexParameter(GL_TEXTURE_WRAP_S,glTexParameter(GL_TEXTURE_WRAP_S, GL_REPEAT);GL_REPEAT);

• For t we use For t we use GL_TEXTURE_WRAPGL_TEXTURE_WRAP__TT

• For clamping we use For clamping we use GL_CLAMPGL_CLAMP

FirstFirst problem is what happens if we specify a problem is what happens if we specify a value of s & t outside the range (0.0, 1.0).value of s & t outside the range (0.0, 1.0).

• Values below this interval cause the texture to repeat.Values below this interval cause the texture to repeat.

• Values above this interval cause the texture to clamp.Values above this interval cause the texture to clamp.

For repeated textures we:For repeated textures we:

glTexParameter(GL_TEXTURE_WRAP_S,glTexParameter(GL_TEXTURE_WRAP_S, GL_REPEAT);GL_REPEAT);

• For t we use For t we use GL_TEXTURE_WRAPGL_TEXTURE_WRAP__TT

• For clamping we use For clamping we use GL_CLAMPGL_CLAMP

Aliasing (1/3)● Aliasing is a Aliasing is a secondsecond problem. problem.● Sometimes the texel is larger Sometimes the texel is larger

or smaller than a pixel.or smaller than a pixel.● To magnify the texel:To magnify the texel:

glTexParameter(GL_TEXTURE_2D,glTexParameter(GL_TEXTURE_2D,GL_TEXTURE_MAG_FILTER, GL_NEARESTGL_TEXTURE_MAG_FILTER, GL_NEAREST););

● To minify the texel:To minify the texel:glTexParameter(GL_TEXTURE_2D, glTexParameter(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_TEXTURE_MIN_FILTER,

GL_NEAREST);GL_NEAREST);

● To get a more visuallyTo get a more visuallypleasing image we pleasing image we use filteringuse filtering to obtainto obtainanan averageaverage texel value.texel value.

● OpenGL can do this OpenGL can do this iif we specify GL_LINEARf we specify GL_LINEAR instead ofinstead of GL_NEAREST.GL_NEAREST.

● Aliasing is a Aliasing is a secondsecond problem. problem.● Sometimes the texel is larger Sometimes the texel is larger

or smaller than a pixel.or smaller than a pixel.● To magnify the texel:To magnify the texel:

glTexParameter(GL_TEXTURE_2D,glTexParameter(GL_TEXTURE_2D,GL_TEXTURE_MAG_FILTER, GL_NEARESTGL_TEXTURE_MAG_FILTER, GL_NEAREST););

● To minify the texel:To minify the texel:glTexParameter(GL_TEXTURE_2D, glTexParameter(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_TEXTURE_MIN_FILTER,

GL_NEAREST);GL_NEAREST);

● To get a more visuallyTo get a more visuallypleasing image we pleasing image we use filteringuse filtering to obtainto obtainanan averageaverage texel value.texel value.

● OpenGL can do this OpenGL can do this iif we specify GL_LINEARf we specify GL_LINEAR instead ofinstead of GL_NEAREST.GL_NEAREST.

Aliasing (2/3)

● If 2nd param = If 2nd param = GL_TEXTURE_MIN_FILTERGL_TEXTURE_MIN_FILTER

● 3th 3th param param can be can be GL_NEARESTGL_NEAREST,, point samplingpoint samplingGL_LINEARGL_LINEAR,, linear interpolationlinear interpolation

oror MIPMAP MIPMAPss ((texture pyramidtexture pyramids) :s) :GL_NEAREST_MIPMAP_NEARESTGL_NEAREST_MIPMAP_NEAREST

GL_LINEAR_MIPMAP_NEARESTGL_LINEAR_MIPMAP_NEAREST

GL_NEAREST_MIPMAP_LINEARGL_NEAREST_MIPMAP_LINEAR

GL_LINEAR_MIPMAP_LINEARGL_LINEAR_MIPMAP_LINEAR

● If 2nd param = If 2nd param = GL_TEXTURE_MIN_FILTERGL_TEXTURE_MIN_FILTER

● 3th 3th param param can be can be GL_NEARESTGL_NEAREST,, point samplingpoint samplingGL_LINEARGL_LINEAR,, linear interpolationlinear interpolation

oror MIPMAP MIPMAPss ((texture pyramidtexture pyramids) :s) :GL_NEAREST_MIPMAP_NEARESTGL_NEAREST_MIPMAP_NEAREST

GL_LINEAR_MIPMAP_NEARESTGL_LINEAR_MIPMAP_NEAREST

GL_NEAREST_MIPMAP_LINEARGL_NEAREST_MIPMAP_LINEAR

GL_LINEAR_MIPMAP_LINEARGL_LINEAR_MIPMAP_LINEAR

½ × ½

¼ × ¼

... Size reduced until 1x1

Aliasing (3/3)

Aliasing with Filtering

OpenGL tries to pick best mipmap levelOpenGL tries to pick best mipmap level

Question: Question: Which texel corresponds to a particular pixel?Which texel corresponds to a particular pixel?

GL_NEAREST (Point Sampling)GL_NEAREST (Point Sampling)• Pick the texel with center nearest pixelPick the texel with center nearest pixel

GL_LINEAR (Bilinear Sampling)GL_LINEAR (Bilinear Sampling)• Weighted average of 2x2 closest texelsWeighted average of 2x2 closest texels

GL_NEAREST_MIPMAP_LINEARGL_NEAREST_MIPMAP_LINEAR• Average nearest texels from two mipmap levelsAverage nearest texels from two mipmap levels

GL_LINEAR_MIPMAP_LINEAR (Trilinear)GL_LINEAR_MIPMAP_LINEAR (Trilinear)• Average two averaged texels from two mipmapsAverage two averaged texels from two mipmaps

OpenGL tries to pick best mipmap levelOpenGL tries to pick best mipmap level

Question: Question: Which texel corresponds to a particular pixel?Which texel corresponds to a particular pixel?

GL_NEAREST (Point Sampling)GL_NEAREST (Point Sampling)• Pick the texel with center nearest pixelPick the texel with center nearest pixel

GL_LINEAR (Bilinear Sampling)GL_LINEAR (Bilinear Sampling)• Weighted average of 2x2 closest texelsWeighted average of 2x2 closest texels

GL_NEAREST_MIPMAP_LINEARGL_NEAREST_MIPMAP_LINEAR• Average nearest texels from two mipmap levelsAverage nearest texels from two mipmap levels

GL_LINEAR_MIPMAP_LINEAR (Trilinear)GL_LINEAR_MIPMAP_LINEAR (Trilinear)• Average two averaged texels from two mipmapsAverage two averaged texels from two mipmaps

gluBuild2DMipMapsint int gluBuild2DMipmapsgluBuild2DMipmaps((

GLenum GLenum target,target, GL_TEXTURE_2D: target texture bufferGL_TEXTURE_2D: target texture bufferGLint GLint level,level, 0, 1, 2, …: level-of-detail for Mip-Map0, 1, 2, …: level-of-detail for Mip-MapGLint GLint components,components, 0, 1, 2, 3 : components0, 1, 2, 3 : componentsGLsizei GLsizei width,width, width of texturewidth of textureGLsizei GLsizei height,height, height of textureheight of textureGLint GLint border,border, 0 : border width0 : border widthGLenum GLenum format,format, color format of color format of pixelpixelss (R, G, B, A) (R, G, B, A)GLenum GLenum type,type, type of type of pixelpixel data data (int, short, long, …) (int, short, long, …)const GLvoid* const GLvoid* pixelspixels source color arraysource color array););

For a 64 x 64 original array we can set up 32 x 32, 16For a 64 x 64 original array we can set up 32 x 32, 16 x 16, 8 x 8, 4 x 4, 2 x2, x 16, 8 x 8, 4 x 4, 2 x2, & 1 x 1 arrays through& 1 x 1 arrays through ::

gluBuild2DMipMapsgluBuild2DMipMaps (( GL_TEXTURE_2D, 3, 64, 64,GL_TEXTURE_2D, 3, 64, 64,GL_RGB, GL_UNSIGNED_BYTE, my_texelsGL_RGB, GL_UNSIGNED_BYTE, my_texels ););

int int gluBuild2DMipmapsgluBuild2DMipmaps((GLenum GLenum target,target, GL_TEXTURE_2D: target texture bufferGL_TEXTURE_2D: target texture bufferGLint GLint level,level, 0, 1, 2, …: level-of-detail for Mip-Map0, 1, 2, …: level-of-detail for Mip-MapGLint GLint components,components, 0, 1, 2, 3 : components0, 1, 2, 3 : componentsGLsizei GLsizei width,width, width of texturewidth of textureGLsizei GLsizei height,height, height of textureheight of textureGLint GLint border,border, 0 : border width0 : border widthGLenum GLenum format,format, color format of color format of pixelpixelss (R, G, B, A) (R, G, B, A)GLenum GLenum type,type, type of type of pixelpixel data data (int, short, long, …) (int, short, long, …)const GLvoid* const GLvoid* pixelspixels source color arraysource color array););

For a 64 x 64 original array we can set up 32 x 32, 16For a 64 x 64 original array we can set up 32 x 32, 16 x 16, 8 x 8, 4 x 4, 2 x2, x 16, 8 x 8, 4 x 4, 2 x2, & 1 x 1 arrays through& 1 x 1 arrays through ::

gluBuild2DMipMapsgluBuild2DMipMaps (( GL_TEXTURE_2D, 3, 64, 64,GL_TEXTURE_2D, 3, 64, 64,GL_RGB, GL_UNSIGNED_BYTE, my_texelsGL_RGB, GL_UNSIGNED_BYTE, my_texels ););

MIPMAPS

With versus without MIPMAPWith versus without MIPMAPWith versus without MIPMAPWith versus without MIPMAP

Texture and Shading● A forth problem is the interaction between texture A forth problem is the interaction between texture

andand shading.shading.● Modulation Solution:Modulation Solution:

– void void glTexEnviglTexEnvi((– GLenum GLenum targettarget, , GL_TEXTURE_2D: target texture bufferGL_TEXTURE_2D: target texture buffer– GLenum GLenum pnamepname, , GL_TEX_ENV_MODE GL_TEX_ENV_MODE – GLint GLint paramparam GL_MODULATE, GL_DECALGL_MODULATE, GL_DECAL– ););

• Example :Example :– glTexEnv(GL_TEX_ENV, GL_ENV_MODE,glTexEnv(GL_TEX_ENV, GL_ENV_MODE, GL_MODULATE);GL_MODULATE);

● Decaling Solution:Decaling Solution:• If we replace GL_MODULATE by GL_DECAL,If we replace GL_MODULATE by GL_DECAL, the color of the texturethe color of the texture

determines the color ofdetermines the color of the object.the object.

● A forth problem is the interaction between texture A forth problem is the interaction between texture andand shading.shading.

● Modulation Solution:Modulation Solution:– void void glTexEnviglTexEnvi((– GLenum GLenum targettarget, , GL_TEXTURE_2D: target texture bufferGL_TEXTURE_2D: target texture buffer– GLenum GLenum pnamepname, , GL_TEX_ENV_MODE GL_TEX_ENV_MODE – GLint GLint paramparam GL_MODULATE, GL_DECALGL_MODULATE, GL_DECAL– ););

• Example :Example :– glTexEnv(GL_TEX_ENV, GL_ENV_MODE,glTexEnv(GL_TEX_ENV, GL_ENV_MODE, GL_MODULATE);GL_MODULATE);

● Decaling Solution:Decaling Solution:• If we replace GL_MODULATE by GL_DECAL,If we replace GL_MODULATE by GL_DECAL, the color of the texturethe color of the texture

determines the color ofdetermines the color of the object.the object.

Perspective Projection

Proper texture mapping also depends on what type ofProper texture mapping also depends on what type of projection is used.projection is used.

Default is Linear Interpolation.Default is Linear Interpolation.

• It does not work well with perspectiveIt does not work well with perspective projections.projections.

We can use a better interpolation by:We can use a better interpolation by:

glHint(GL_PERPECTIVE_CORRECTION,glHint(GL_PERPECTIVE_CORRECTION, GL_NICEST);GL_NICEST);

Proper texture mapping also depends on what type ofProper texture mapping also depends on what type of projection is used.projection is used.

Default is Linear Interpolation.Default is Linear Interpolation.

• It does not work well with perspectiveIt does not work well with perspective projections.projections.

We can use a better interpolation by:We can use a better interpolation by:

glHint(GL_PERPECTIVE_CORRECTION,glHint(GL_PERPECTIVE_CORRECTION, GL_NICEST);GL_NICEST);

Environmental Maps

Environment Mapping● Blinn, “Blinn, “Models of light reflection for computer synthesized picturesModels of light reflection for computer synthesized pictures”, ”,

Computer GraphicsComputer Graphics, 11(2):192~198, 1977., 11(2):192~198, 1977.

● Greene, “Greene, “Environment mapping and other applications of world Environment mapping and other applications of world projectionsprojections”, ”, IEEE CG&AIEEE CG&A, 6(11):21~29, 1986., 6(11):21~29, 1986.

● = = RReflection mappingeflection mapping

It does not use It does not use ray tracingray tracing methods. methods.

● Blinn, “Blinn, “Models of light reflection for computer synthesized picturesModels of light reflection for computer synthesized pictures”, ”, Computer GraphicsComputer Graphics, 11(2):192~198, 1977., 11(2):192~198, 1977.

● Greene, “Greene, “Environment mapping and other applications of world Environment mapping and other applications of world projectionsprojections”, ”, IEEE CG&AIEEE CG&A, 6(11):21~29, 1986., 6(11):21~29, 1986.

● = = RReflection mappingeflection mapping

It does not use It does not use ray tracingray tracing methods. methods.

shiny object

camera object

shiny object

camera object

environmenttexturemapping

ray tracing environment mapping

Environment Mapping

Ray Tracing vs. Environment Map

environment map ray tracing

Environment Mapping

2 stage algorithm2 stage algorithm2 stage algorithm2 stage algorithm

Environment map (intermediate object)

Environment map

Texture mapping

R : reflection vector

Environment Mapping

● Used to model a object that reflects surrounding Used to model a object that reflects surrounding textures to the eyetextures to the eye• Polished sphere reflects walls and ceiling texturesPolished sphere reflects walls and ceiling textures

• Cyborg in Terminator 2 reflects flaming destructionCyborg in Terminator 2 reflects flaming destruction

● Texture is distorted fish-eye view of Texture is distorted fish-eye view of environmentenvironment

● Spherical texture mapping creates texture Spherical texture mapping creates texture coordinates that correctly index into this texture coordinates that correctly index into this texture mapmap

● Used to model a object that reflects surrounding Used to model a object that reflects surrounding textures to the eyetextures to the eye• Polished sphere reflects walls and ceiling texturesPolished sphere reflects walls and ceiling textures

• Cyborg in Terminator 2 reflects flaming destructionCyborg in Terminator 2 reflects flaming destruction

● Texture is distorted fish-eye view of Texture is distorted fish-eye view of environmentenvironment

● Spherical texture mapping creates texture Spherical texture mapping creates texture coordinates that correctly index into this texture coordinates that correctly index into this texture mapmap

Sphere Mapping

Blinn/Newell Lattitude Mapping

Cube Mapping

Bump Maps

Bump Mapping

Blinn, “Blinn, “Simulation of wrinkled surfacesSimulation of wrinkled surfaces”, ”, Computer GraphicsComputer Graphics, 1978., 1978.

●Use textures to modify surface geometryUse textures to modify surface geometry

●Use texel values to modify surface normals of Use texel values to modify surface normals of polygonpolygon

●Texel values correspond to Texel values correspond to height fieldheight field

• Height field models a rough surfaceHeight field models a rough surface

●Partial derivative of bump map specifies change Partial derivative of bump map specifies change to surface normalto surface normal

Blinn, “Blinn, “Simulation of wrinkled surfacesSimulation of wrinkled surfaces”, ”, Computer GraphicsComputer Graphics, 1978., 1978.

●Use textures to modify surface geometryUse textures to modify surface geometry

●Use texel values to modify surface normals of Use texel values to modify surface normals of polygonpolygon

●Texel values correspond to Texel values correspond to height fieldheight field

• Height field models a rough surfaceHeight field models a rough surface

●Partial derivative of bump map specifies change Partial derivative of bump map specifies change to surface normalto surface normal

Bump Mapping

Bump Mapping Process

vu

PP

N

NPP ),(),(),(' vuBvuvu

uv

B

vu

B

v

B

vu

B

uvu

PN

PNN

NP

NPPP

N''

'

uB

u

B

uB

uu

N

NP

NPP

)('

vB

v

B

vB

vv

N

NP

NPP

)('

P(u,v)

N(u,v)

B(u,v)

P’(u,v)

N’(u,v)

Bump Mapping Process

DN

BAN

PN

PNNN

v

B

u

Buv

B

vu

B'

N

uP

vP

P

N

v

P

NA

u

P

NB

D

Two-pass Bump Mapping

McReynolds and Blythe, “McReynolds and Blythe, “Programming with OpenGL: Advanced Programming with OpenGL: Advanced RenderingRendering”, ”, SIGGRAPH’97 Lecture NotesSIGGRAPH’97 Lecture Notes..

● Key Idea :Key Idea : NN’’··LL = = NN··L L + + DD··LL

● NN··LL : : Gouraud ShadingGouraud Shading

● DD··LL : : image image of surface detailof surface detailapproximationapproximation

McReynolds and Blythe, “McReynolds and Blythe, “Programming with OpenGL: Advanced Programming with OpenGL: Advanced RenderingRendering”, ”, SIGGRAPH’97 Lecture NotesSIGGRAPH’97 Lecture Notes..

● Key Idea :Key Idea : NN’’··LL = = NN··L L + + DD··LL

● NN··LL : : Gouraud ShadingGouraud Shading

● DD··LL : : image image of surface detailof surface detailapproximationapproximation

uv

B

vu

B

P

NP

ND

Multirendering and The Accumulation Buffer

Accumulation Buffer

AA buffer buffer for multirendering for multirendering• Same as Same as frame buffer resolutionframe buffer resolution

BeforeBefore operation operationglClear(GL_ACCUM_BUFFER_BIT);glClear(GL_ACCUM_BUFFER_BIT);• AccumBuffer AccumBuffer 0 0

void void glAccumglAccum( GLenum( GLenum opop,, GLfloatGLfloat valuevalue );); • GL_LOAD :GL_LOAD : AccumBuffer AccumBuffer FrameBuffer FrameBuffer

• GL_ACCUM :GL_ACCUM : AccumBuffer AccumBuffer AccumBuffer + value * FrameBuffer AccumBuffer + value * FrameBuffer

• GL_MULT :GL_MULT : AccumBuffer AccumBuffer AccumBuffer * value AccumBuffer * value

• GL_RETURN:GL_RETURN: FrameBuffer FrameBuffer AccumBuffer AccumBuffer

AA buffer buffer for multirendering for multirendering• Same as Same as frame buffer resolutionframe buffer resolution

BeforeBefore operation operationglClear(GL_ACCUM_BUFFER_BIT);glClear(GL_ACCUM_BUFFER_BIT);• AccumBuffer AccumBuffer 0 0

void void glAccumglAccum( GLenum( GLenum opop,, GLfloatGLfloat valuevalue );); • GL_LOAD :GL_LOAD : AccumBuffer AccumBuffer FrameBuffer FrameBuffer

• GL_ACCUM :GL_ACCUM : AccumBuffer AccumBuffer AccumBuffer + value * FrameBuffer AccumBuffer + value * FrameBuffer

• GL_MULT :GL_MULT : AccumBuffer AccumBuffer AccumBuffer * value AccumBuffer * value

• GL_RETURN:GL_RETURN: FrameBuffer FrameBuffer AccumBuffer AccumBuffer

Accumulation Buffer● clearclear● make FrameBuffer with camera at (x, y)make FrameBuffer with camera at (x, y)● AccumBuffer AccumBuffer AccumBuffer + 1.0 * FrameBuffer AccumBuffer + 1.0 * FrameBuffer● make FrameBuffer with camera at (x+1, y)make FrameBuffer with camera at (x+1, y)● AccumBuffer AccumBuffer AccumBuffer + 1.0 * FrameBuffer AccumBuffer + 1.0 * FrameBuffer● make FrameBuffer with camera at (x–1, y)make FrameBuffer with camera at (x–1, y)● AccumBuffer AccumBuffer AccumBuffer + 1.0 * FrameBuffer AccumBuffer + 1.0 * FrameBuffer● AccumBuffer AccumBuffer AccumBuffer * 0.33 AccumBuffer * 0.33● FrameBuffer FrameBuffer AccumBuffer AccumBuffer

● clearclear● make FrameBuffer with camera at (x, y)make FrameBuffer with camera at (x, y)● AccumBuffer AccumBuffer AccumBuffer + 1.0 * FrameBuffer AccumBuffer + 1.0 * FrameBuffer● make FrameBuffer with camera at (x+1, y)make FrameBuffer with camera at (x+1, y)● AccumBuffer AccumBuffer AccumBuffer + 1.0 * FrameBuffer AccumBuffer + 1.0 * FrameBuffer● make FrameBuffer with camera at (x–1, y)make FrameBuffer with camera at (x–1, y)● AccumBuffer AccumBuffer AccumBuffer + 1.0 * FrameBuffer AccumBuffer + 1.0 * FrameBuffer● AccumBuffer AccumBuffer AccumBuffer * 0.33 AccumBuffer * 0.33● FrameBuffer FrameBuffer AccumBuffer AccumBuffer

1/3 1/3

convoluted image

1/3

Accumulation Buffer

glClear( GL_ACCUM_BUFFER_BIT);glClear( GL_ACCUM_BUFFER_BIT);for (i=0; i<num_images; i++)for (i=0; i<num_images; i++){{

glClear( GL_COLOR_BUFFER_BIT |glClear( GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT ); GL_DEPTH_BUFFER_BIT );display_image(i);display_image(i);glAccum( GL_ACCUM, 1.0/ (float) glAccum( GL_ACCUM, 1.0/ (float)

num_images );num_images );}}

glAccum( GL_RETURN, 1.0);glAccum( GL_RETURN, 1.0);

glClear( GL_ACCUM_BUFFER_BIT);glClear( GL_ACCUM_BUFFER_BIT);for (i=0; i<num_images; i++)for (i=0; i<num_images; i++){{

glClear( GL_COLOR_BUFFER_BIT |glClear( GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT ); GL_DEPTH_BUFFER_BIT );display_image(i);display_image(i);glAccum( GL_ACCUM, 1.0/ (float) glAccum( GL_ACCUM, 1.0/ (float)

num_images );num_images );}}

glAccum( GL_RETURN, 1.0);glAccum( GL_RETURN, 1.0);

Other Multipass Methods: Motion Blur

t = 0.0

t = 0.1

t = 0.2

t = 0.3

motion blurred image

another example

Depth of Field

When camera When camera focusfocused an object, neared an object, near and far objects are and far objects are blured.blured.

AAccumulation bufferccumulation buffercan be used for can be used for to generate this effect.to generate this effect.

When camera When camera focusfocused an object, neared an object, near and far objects are and far objects are blured.blured.

AAccumulation bufferccumulation buffercan be used for can be used for to generate this effect.to generate this effect.

camera #1

camera #2

camera #3

focused view

Accumulation

Sampling and Aliasing

Nyquist sampling theorem

The ideal samples of a continuous function The ideal samples of a continuous function contain all the information in the original contain all the information in the original function function if and only ifif and only if the continuous the continuous function is sampled at a frequency function is sampled at a frequency at least at least twice the highest frequency in the twice the highest frequency in the function.function.

We can reconstruct a continuous function We can reconstruct a continuous function ff((xx) from its samples {) from its samples {ffii} by the formula:} by the formula:

The ideal samples of a continuous function The ideal samples of a continuous function contain all the information in the original contain all the information in the original function function if and only ifif and only if the continuous the continuous function is sampled at a frequency function is sampled at a frequency at least at least twice the highest frequency in the twice the highest frequency in the function.function.

We can reconstruct a continuous function We can reconstruct a continuous function ff((xx) from its samples {) from its samples {ffii} by the formula:} by the formula:

x

xx

xxfyxf ii

i

sin

)sinc(

)sinc(),(

Aliasing of sinusoid

Images

An image is a 2D function An image is a 2D function II(x, y) that specifies (x, y) that specifies intensity for each point (x, y)intensity for each point (x, y)

An image is a 2D function An image is a 2D function II(x, y) that specifies (x, y) that specifies intensity for each point (x, y)intensity for each point (x, y)

Sampling and Image

Our goal is to convert the continuous image to a Our goal is to convert the continuous image to a discrete set of samplesdiscrete set of samples

The graphics system’s display hardware will The graphics system’s display hardware will attempt to reconvert the samples into a attempt to reconvert the samples into a continuous image:continuous image: reconstructionreconstruction

Our goal is to convert the continuous image to a Our goal is to convert the continuous image to a discrete set of samplesdiscrete set of samples

The graphics system’s display hardware will The graphics system’s display hardware will attempt to reconvert the samples into a attempt to reconvert the samples into a continuous image:continuous image: reconstructionreconstruction

Point Sampling an Image

● Simplest sampling is on a gridSimplest sampling is on a grid

● Sample dependsSample dependssolely on valuesolely on valueat grid pointsat grid points

● Simplest sampling is on a gridSimplest sampling is on a grid

● Sample dependsSample dependssolely on valuesolely on valueat grid pointsat grid points

Point Sampling

Multiply sample grid by image intensity to obtain a Multiply sample grid by image intensity to obtain a discrete set of points, or samples.discrete set of points, or samples.

Multiply sample grid by image intensity to obtain a Multiply sample grid by image intensity to obtain a discrete set of points, or samples.discrete set of points, or samples.

Sampling Geometry

Some objects missed entirely, others poorly Some objects missed entirely, others poorly sampledsampled

Some objects missed entirely, others poorly Some objects missed entirely, others poorly sampledsampled

Sampling Errors

Fixing Sampling Errors

SupersamplingSupersampling

• Take more than one sample for each pixel and combine Take more than one sample for each pixel and combine themthem

– How many How many samples is samples is enough?enough?

– How do we How do we know no know no features are features are lost?lost?

SupersamplingSupersampling

• Take more than one sample for each pixel and combine Take more than one sample for each pixel and combine themthem

– How many How many samples is samples is enough?enough?

– How do we How do we know no know no features are features are lost?lost?

150x15 to 100x10

200x20 to 100x10

300x30 to 100x10

400x40 to 100x10

Unweighted Area Sampling

Average supersampled pointsAverage supersampled points

All points are weighted equallyAll points are weighted equally

Average supersampled pointsAverage supersampled points

All points are weighted equallyAll points are weighted equally

Weighted Area Sampling

Points in pixel are weighted differentlyPoints in pixel are weighted differently

• Flickering occurs as object movesFlickering occurs as object movesacross displayacross display

Overlapping regions eliminates flickerOverlapping regions eliminates flicker

Points in pixel are weighted differentlyPoints in pixel are weighted differently

• Flickering occurs as object movesFlickering occurs as object movesacross displayacross display

Overlapping regions eliminates flickerOverlapping regions eliminates flicker

How is this done today?Full Screen Antialiasing

Nvidia GeForce2Nvidia GeForce2• OpenGL: render image 400% larger and supersampleOpenGL: render image 400% larger and supersample

• Direct3D: render image 400% - 1600% largerDirect3D: render image 400% - 1600% larger

Nvidia GeForce3Nvidia GeForce3• MultisamplingMultisampling but with fancy overlaps but with fancy overlaps

– Don’t render at higher resolutionDon’t render at higher resolution

– Use one image, but combine values of neighboring pixelsUse one image, but combine values of neighboring pixels

– Beware of recognizable combination artifactsBeware of recognizable combination artifacts

• Human perception of patterns is too goodHuman perception of patterns is too good

Nvidia GeForce2Nvidia GeForce2• OpenGL: render image 400% larger and supersampleOpenGL: render image 400% larger and supersample

• Direct3D: render image 400% - 1600% largerDirect3D: render image 400% - 1600% larger

Nvidia GeForce3Nvidia GeForce3• MultisamplingMultisampling but with fancy overlaps but with fancy overlaps

– Don’t render at higher resolutionDon’t render at higher resolution

– Use one image, but combine values of neighboring pixelsUse one image, but combine values of neighboring pixels

– Beware of recognizable combination artifactsBeware of recognizable combination artifacts

• Human perception of patterns is too goodHuman perception of patterns is too good

GeForce3

MultisamplingMultisampling

• After each pixel is rendered, write pixel value to two After each pixel is rendered, write pixel value to two different places in frame bufferdifferent places in frame buffer

MultisamplingMultisampling

• After each pixel is rendered, write pixel value to two After each pixel is rendered, write pixel value to two different places in frame bufferdifferent places in frame buffer

GeForce3 - Multisampling

After rendering two copies of entire frameAfter rendering two copies of entire frame

• Shift pixels of Sample #2 left and up by ½ pixelShift pixels of Sample #2 left and up by ½ pixel

• Imagine laying Sample #2 (red) over Sample #1 (black)Imagine laying Sample #2 (red) over Sample #1 (black)

After rendering two copies of entire frameAfter rendering two copies of entire frame

• Shift pixels of Sample #2 left and up by ½ pixelShift pixels of Sample #2 left and up by ½ pixel

• Imagine laying Sample #2 (red) over Sample #1 (black)Imagine laying Sample #2 (red) over Sample #1 (black)


Resolve the two samples into one image by computingResolve the two samples into one image by computingaverage between each pixel from Sample 1 (black) andaverage between each pixel from Sample 1 (black) andthe four pixels from Sample 2 (red) thatthe four pixels from Sample 2 (red) that areare1/ sqrt(2) pixels1/ sqrt(2) pixels awayaway

Resolve the two samples into one image by computingResolve the two samples into one image by computingaverage between each pixel from Sample 1 (black) andaverage between each pixel from Sample 1 (black) andthe four pixels from Sample 2 (red) thatthe four pixels from Sample 2 (red) that areare1/ sqrt(2) pixels1/ sqrt(2) pixels awayaway


No AA No AA MultisamplingMultisamplingNo AA No AA MultisamplingMultisampling

4x Supersample 4x Supersample MultisamplingMultisampling


Buffers and Mappings Ar.Gör.Cengiz Güngör [email protected] UBI 516 Advanced Computer...

Documents

Transcript of Buffers and Mappings Ar.Gör.Cengiz Güngör [email protected] UBI 516 Advanced Computer...