Discrete technique

1. Discrete technique

2. Scope • Buffers • Various of graphics image • Texture mapping • OpenGL sample program

3. Buffers • Former chapter introduce 2 types • color buffers and depth buffer • Buffers are discrete and can be defined as a block of memory with a spatial resolution nxm k-bit elements • Others are defended with the same way

4. FrameBuffers • Color buffer • Front buffer and Back buffer • 32 bit for RGBA • Depth buffer • Deal with z value

5. Digital Images:Image format • We work with pixel and bit operation to digital image • Various format type • Bitmap (bmp) • TIFF (tif) • 2 forms: uncompress and compressed • Joint Photographic Experts Group (JPG or JPEG) • Compressed image • Post Script (PS) : • In printer control • Coded in 7 bit of ASCII character set • Understood by a large class of printer • Large in size • Encapsulated Post Script (EPS) • More additional information for previewing images with PS format • GIF • For index images with color table and an array of image indices.

6. Digital image examples (a) Original TIFF luminance image. (b) JPEG image compressed by a factor of 18. (c) JPEG image compressed by a factor of 37

7. When image is loaded it may be kept as array of 2 dimension myimage[512][512][3]; // array of 512x512 pixels 3 channel Glubytemyimage[512][512]; // luminace images only Black and white // color-index mode use pointer into table of color plus three color table GLubytemyimage[512][512], red[256], green[256], blue[256]; // when activate red[myimage[i][j]) or else. • Example: 512x512 red-black checker board GLubyte check[512][512]; int i,j; for (i=0; i<512; i++) for(j=0; j<512; j++) { for(k=0;k<3;k++) check[i][j][k]=0; // clear to black if((8*i+j/64)%64) check[i][j][0]=255; // set to red }

8. Writing to buffers • Single read/write to single pixel or bit • Trending to read/write blocks of pixels (bit blocks) • Known as raster operation write-block(source, n, m, x, y, destination, u, v); // read nxm size of source at location x,y to destination u,v

9. Writing Modes • Read before write d <- f(d,s) //destination is function of former value of destination and source • OpenGL support all 16 different modes • The concept is write-to memory is replacement • Ex. y=x; // value of y is replace by value of x

10. 16 possible functions for 2 input writing mode Let “1” mean black, “0” mean white Example for Mode 3 d<-s // load black with white -> white for mode 7 d <- d+s // load black with black+white -> black

11. XOR mode • Mode 6 • If applied twice, return to the original state • ex. menu from chapter 3. called backing store • let S=screen, M=menu • For 3 operations the menu is appear

12. Bit and Pixel Operations in OpenGL • OpenGL Buffers and the Pixel Pipeline • Bitmaps • Raster fonts • Pixel and Images • Lookup Tables • Buffer for Picking

13. OpenGL Buffers and the Pixel Pipeline • Color buffers • Front and back buffer • Right and left buffer: produce stereo pair • Depth buffer • Hidden surface removal • read/writable • Accumulation buffer • Combination of multiple image • Stencil buffer • Masking operation

14. Color buffers • Normal display has 2 color buffers • Front buffer and back buffer • For stereo display (2 display for 2 eyes) • 4 color buffers are suit • Left front buffer, right front buffer • Left back buffer, right back buffer • Only color buffer is visible

15. Depth buffers • Used for hidden-surface removal • Read-writable

16. Bitmaps • one-bit pixels arrays

17. Raster Fonts • Bitmap font • Unable to rotate or used transform manipulation

18. Pixels and Images • Screen smallest element • Image just 2D

19. Lookup Tables

20. Buffers for Picking • use when there is not much of object • simpler to implement • suppose no more than of 256 identifiers (8 bit deep) • use pixel reading function

21. Mapping Methods • Texture mapping • Pattern (texture) determined the color of fragment • Map on smooth surface • Bump mapping • Distort the normal vector • Make some bump on surface • Environmental mapping • Image that have the appearance of ray trace

22. Texture Mapping (pattern mapping) • Pattern types • regular pattern : curve, stripes and checkerboards etc. • complex patterns : natural materials • Brought into as array • Element of texture called texel • Texture dimension • 1D for stripe, curve etc (s, 0, 0, 1) • 2D use to map on surface (s, t, 0, 1) • 3D map on solid box (s, t, r, 1) • 4D map (s, t, r, q)

23. Two-Dimensional Texture Mapping • Mapping involved among 3 or 4 different coordinate systems. • Screen coordinate at first, Final at world coordinate system (xs,ys) • World coordinate: object is described here (x, y, z) • Texture coordinate: describe texture (s,t) • Parametric coordinate: for the relation of curve or surface (u,v) • Texture process • Start out with 2D image may come from • Photo scanning • Form by application • Brought into the memory array • Smallest element call texel (texture element) • texel is represented by T(s,t) (textel coordinate) • where s and t are texture coordinate. • Often range between 0 and 1

24. Mapping approach • Mapping concept, let (x,y,z,w) object coordinate thus • How do we find the texel for each (x,y,z) point ? • form • s=s(x, y, z, w) and t=t(x,y,z,w) • If parametric object, how we map with them?

25. A method of texture mapping Texture maps for a parametric surface. Map texture together with parametric on to geometric coordinate Last project onto the screen coordinate

26. Map the texture coordinate to geometric coordinate • Texture to screen coordinate • We interested in mapping area to area • Aliasing problem may happen

27. Direct mapping between texel coordinate to parametric coordinate

28. Two-part mapping • Use for map on curve surface • 2 steps • Map texture on intermediate surface • Map intermediate surface to surface being rendered • Useable both parametric and geometric coordinate

29. Texture mapping with a cylinder surface Texture mapping to parametric surface What happen if the object is sphere? Some distortion happen at the pole. Why ?

30. Mapping texture on the intermediate object • 3 possible strategies • Place the texture at the finding point of intersection of normal from object edge • Place the texture at the interaction point of normal intersect the intermediate surface • Draw a line from the center of the object to edge

31. Texture Mapping in OpenGL OpenGL pipelines merge at rendering (rasterization) stage process: maps 3D points to pixels on the display. visibility is test (with the z-buffer) and is shaded if visible. Vertices are mapped to texture coordinates in object defined stage, values can then be obtained by interpolation like color to polygons

32. Define texel array • Assign to texture image • Enable texture GLubyte my_texels[512][512]; glTexImage2D(GL_TEXTURE_2D, 0, 3, 512, 512, 0, GL_RGB, GL_UNSIGNED_BYTE, my_texels); glEnable(GL_TEXTURE_2D);

33. Defining texture to object.(display process) • t and s have value between 0 and 1 correspond to texel array (mytexels) • Mapping can happened at object definition stage in glBegin and glEnd loop glBegin{GL_QUAD); glTexCoord2f(0.0,0.0); glVertex2f(x1, y1, z1); glTexCoord2f(1.0,0.0); glVertex2f(x2, y2, z2); glTexCoord2f(1.0,1.0); glVertex2f(x3, y3, z3); glTexCoord2f(0.0,1.0); glVertex2f(x4, y4, z4); glEnd(); Correspond of texel to image coordinate. Opengl use interpolate to match the image. Map texture using glTexCoord

34. Texture map condition (a) (original) 100% (b) 50% of texture Mapping of texture to polygons. (a and b) Mapping of a checkerboard texture to a triangle. (c) Mapping of a checkerboard texture to a trapezoid.

35. When (s,t) outside (0,1)(texture parameter setting) • We can set for repeat or clamp when value is out of bound glTexParameteri(GL_TEXTURE_WRAP_S, GL_REPEAT); // for s glTexParameteri(GL_TEXTURE_WRAP_T, GL_CLAMP); // clamp t

36. Alias problem • Texel is rarely get the center • Use point sampling • Closet texel is use for interpolate • Weighted average of a group of texel • Linear filtering • Problem may occur at the edge • Add more texel row and colum • (2m+1)x(2n+1)

37. When texel doesn’t math the pixel Mapping texels to pixels condition (a) Magnification. (b) Minification. In both cases, use the value of the nearest point sampling. glTexParameteri(GL_TEXTURE_2D,GL_TEXTURE_MAG_FILTER,GL_NEAREST); glTexParameteri(GL_TEXTURE_2D,GL_TEXTURE_MIN_FILTER,GL_NEAREST); More smooth use GL_LINEAR instead of GL_NEAREST

38. What do we do when texel is larger than pixel ? • Use mipmapping technique for minification • We can reduce size of texel to match the image by let OpenGL interpolate for a small one gluBuild2DMipmaps(GL_TEXTURE_2D,3,64,64,GL_RGB,GL_UNSIGNED_BYTE, my_texels); Or control parameter level of glTexImage2D() instead glTexImage2D(GL_TEXTURE_2D,level, components, width, height, border, format, type, tarray);

39. Texture and shading • 2 options • Multiply the shading and texture by control • Decal the texture to object glTexEnvi(GL_TEX_ENV, GL_TEX_ENV_MODE, GL_MODULATE); glTexEnvi(GL_TEX_ENV,GL_TEX_ENV_MODE,GL_DECAL);

40. Projection correction • No need for orthogonal projection if linear interpolation is use • For perspective projection • due to non linear depth scaling • a better interpolation is apply by use glHint(GL_PERSPECTIVE_CORRECTION, GL_NICEST);

41. Texture transformation • As vertices definition • Transformation such as scaling, rotating, move etc • Texture coordinate store in the form of 4D matrix call texture matrix • Initially matrix is identical • Manipulate by glMatrixMode() glMatrixMode(GL_TEXTURE);

42. Texture objects • Previous is dealed with single texture at a time. • If need to change texture image, it needs to load to memory again. • Texture Object was introduced in OpenGL 1.0. • This allow to load multexture image to memory, as long as the memory is sufficient. • Each texture is concerned to texture id called texture object.

43. Multitexturing • There are many surface rendering effects that can best be implemented by more than a single application of a texture • The texture mapping with independent texturing state

44. Texture Generation • graphics boards for PC contain a significant amount of memory

45. Environmental / Reflection Maps • global effect: rest of the scene is important for mapping • Appear on highly specular surface eg. shiny metal ball • Mirror the environment • Use physically base rendering method such as ray tracer • basic idea • Object look as polygons with highly specular material • Follow the r = 2(v.n)n-v until intersect the environment • Shad the reflect to the object • Approximate using 2 steps • render the scene without reflector • camera place at the center of reflector • obtain the seen object image • place the image to the reflector

46. Difficulty of environment mapping • The image at first pass is not quite correct due to not an object approach • the mapping problem (second pass) which surface is concerned • classical approach: • project the environment on to a sphere centered at the center of projection

47. Spherical mapping

48. Project environment on sphere • an approaches : the classic approach • project the environment onto object center (sphere) • sphere is divide using longtitude and latitude perform small rectangle • problem may occur at pole (shape distortion become inifinite)

49. spherical mapping • API provide circular image • orthographic projection of sphere onto environment • Difficult is come from obtaining the circular image • approximate by perspective projection with a very wide angle • for Opengl use GL_SPHERE_MAP glTexGeni(GL_S, GL_TEXTURE_GENMODE, GL_SPHERE_MAP); glTexGeni(GL_T, GL_TEXTURE_GENMODE, GL_SPHERE_MAP); glEnable(GL_TEXTURE_GEN_S); glEnable(GL_TEXTURE_GEN_T);

50. One frame from Pixar’s Geri’s Game showing refraction through reflection of Geri’s glasses. Courtesy of Pixar Animation Studio.)