08 textures - computer science and engineeringcs3421/16s2/lectures/08_textures.pdf · it is also...
TRANSCRIPT
![Page 1: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/1.jpg)
COMP3421Texturing
![Page 2: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/2.jpg)
The graphics pipeline
Projection transformation
Illumination
ClippingPerspective division
ViewportRasterisation
Texturing Frame buffer
DisplayHidden surface removal
Model-View Transform
Model Transform
View Transform
Model
User
![Page 3: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/3.jpg)
TexturingTextures are a way to add detail to our models without requiring too many polygons.
Textures are used to add:
• Colour• Reflections• Shadows
• Bumps• Lighting effects• etc...
![Page 4: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/4.jpg)
TexturesA texture is basically a function that maps texture coordinates to pixel values.
Texture coordinates are usually in the range (0,1).
![Page 5: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/5.jpg)
TexturesA texture is basically a function that maps texture coordinates to pixel values.
Texture coordinates are usually in the range (0,1).
texture coordspixel value
![Page 6: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/6.jpg)
TexturesTextures are most commonly represented by bitmaps
i.e. 2D image files
T(s,t) = texel value at (s,t)
texel = pixel on a texture
s
t
(0,0)
(1,1)
![Page 7: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/7.jpg)
Procedural texturesIt is also possible to write code to compute the texture value at a point.
This can be good to generate materials like marble or woodgrain.
![Page 8: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/8.jpg)
Using Textures1.Load or create textures
2.Turn on texturing gl.glEnable(GL2.GL_TEXTURE_2D);
3.Set the current texture
gl.glBindTexture(GL2.GL_TEXTURE_2D,texId);
4.Map texture co-ordinates to vertices
![Page 9: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/9.jpg)
Texture mappingTo add textures to surfaces in on our model, we set texture coordinates for each vertex.
(0,1) (0.25,1)
(0.5,1)(0.75,1)
(0,0) (0.25,0)
(0.5,0)(0.75,0)
(1,1)
(1,0)
![Page 10: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/10.jpg)
Texture Co-ordinatesgl.glNormal3d(0,0,1);
gl.glTexCoord2d(0,0);
gl.glVertex3d(-5,-5,0);
gl.glTexCoord2d(1,0);
gl.glVertex3d(5,-5,0);
//etc
![Page 11: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/11.jpg)
Exercise: Circle
gl.glTexCoord2d(0.5+0.5*Math.cos(theta),
0.5+0.5*Math.sin(theta));
s
t
(0,0)
(1,1) x = cos(theta) y = sin(theta)
![Page 12: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/12.jpg)
Mapping a Cylinder
Cylinder: s is an angle coordinate, t is a height coordinate.
![Page 13: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/13.jpg)
Model Texture MappingWe can assign texture coordinates to vertices however we want. Complex models often have weird flattened textures.
![Page 14: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/14.jpg)
Texture WrapYou can assign texture coordinates outside the range [0,1] and set the texture wrap to
GL2.GL_REPEAT (default)
GL2.GL_MIRRORED_REPEAT
GL2.GL_CLAMP_TO_EDGE
![Page 15: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/15.jpg)
Texture WRAPFor example, setting to GL2.GL_REPEAT in both s and t dimensions:
gl.glTexParameteri( GL2.GL_TEXTURE_2D, GL2.GL_TEXTURE_WRAP_S, GL2.GL_REPEAT);
gl.glTexParameteri( GL2.GL_TEXTURE_2D, GL2.GL_TEXTURE_WRAP_T, GL2.GL_REPEAT);
![Page 16: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/16.jpg)
Repeating a TextureFor example this shows the use of texture coordinates outside [0,1] that repeat the texture, if the setting is GL_REPEAT
![Page 17: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/17.jpg)
Textures and shadingHow do textures interact with shading?
The simplest approach is to replace illumination calculations with a texture look-up.
This produces objects which are not affected by lights or color.
![Page 18: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/18.jpg)
Textures and shadingA more common solution is to use the texture to modulate the ambient and diffuse reflection coefficients:
We usually leave the specular term unaffected because it is unusual for the material colour to affect specular reflections.
![Page 19: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/19.jpg)
OpenGL// to use without lighting
gl.glTexEnvf(GL2.GL_TEXTURE_ENV, GL2.GL_TEXTURE_ENV_MODE, GL2.GL_REPLACE);
// to use with lighting
gl.glTexEnvf(GL2.GL_TEXTURE_ENV, GL2.GL_TEXTURE_ENV_MODE, GL2.GL_MODULATE);
![Page 20: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/20.jpg)
Specular Highlights// to make specular highlights // be unaffected by the // texture set
gl.glLightModeli(
GL2.GL_LIGHT_MODEL_COLOR_CONTROL, GL2.GL_SEPARATE_SPECULAR_COLOR);
![Page 21: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/21.jpg)
Loading textures in JOGL
int nTex = 1; int[] textures = new int[nTex];
//get texture id – release when finished
gl.glGenTextures(nTex, textures, 0);
// Use this texture – set current texture
gl.glBindTexture( GL.GL_TEXTURE_2D, textures[0]);
![Page 22: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/22.jpg)
Loading textures in JOGL
// Loading data from a file – // make sure width and height of // file are a power of 2
GLProfile glp = GLProfile.getDefault();
TextureData data = TextureIO.newTextureData( glp, file, false, "png");
![Page 23: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/23.jpg)
Loading textures in JOGL
// Setting data to current texture gl.glTexImage2D( GL2.GL_TEXTURE_2D, 0,// level of detail: 0 = base data.getInternalFormat(), data.getWidth(), data.getHeight(), 0, // border (must be 0) data.getPixelFormat(), data.getPixelType(), data.getBuffer());
![Page 24: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/24.jpg)
Texture mappingWhen we rasterise an image, we colour each pixel in a polygon by interpolating the texture coordinates of its vertices.
Standard bilinear interpolation does not work because it fails to take into account foreshortening effects in tilted polygons.
Luckily this is done by OpenGL for us
![Page 25: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/25.jpg)
Foreshortening
Equally spaced pixelsin screen space
Unequally spacedin world space
perspective camera
![Page 26: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/26.jpg)
Rendering the TextureLinear vs. correct interpolation example:
![Page 27: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/27.jpg)
Hyperbolic interpolationWe want texture coordinates to interpolate linearly in world space.
But the perspective projection distorts the depth coordinate so that
linear interpolation ≠ linear interpolation in screen space in world space
Hyperbolic interpolation fixes this.
Mathematical details in textbook if desired.
![Page 28: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/28.jpg)
OpenGL Hintsgl.glHint(GL_PERSPECTIVE_CORRECTION_HINT, GL_NICEST)
gl.glHint(GL_PERSPECTIVE_CORRECTION_HINT, GL_FASTEST)
If perspective-corrected parameter interpolation is not efficiently supported by the hinting GL_FASTEST can result in simple linear interpolation
![Page 29: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/29.jpg)
3D texturesWe can also make 3D textures by adding an extra texture coordinate.
Imagine a volume of space with different colours at each point, e.g. a block of wood.
This eliminates weird seams and distortions when a 2D texture is wrapped on a curve 3D surface.
![Page 30: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/30.jpg)
MagnificationNormal bitmap textures have finite detail.
If we zoom in close we can see individual texture pixels (texels).
If the camera is close enough to a textured polygon multiple screen pixels may map to the same texel.
This results in "pixelated" effects.
![Page 31: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/31.jpg)
Magnification
![Page 32: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/32.jpg)
The alignment is probably not exact.
Magnification
pixels
texels
![Page 33: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/33.jpg)
Nearest Texel
pixels
texels
Find the nearest texel.
![Page 34: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/34.jpg)
Bilinear Filtering
pixels
texels
Find the nearest four texels and use bilinear interpolation over them
![Page 35: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/35.jpg)
Bilinear Filtering
No filtering Filtering
![Page 36: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/36.jpg)
Magnification Filtering//bilinear filtering gl.glTexParameteri( GL.GL_TEXTURE_2D, GL.GL_TEXTURE_MAG_FILTER, GL.GL_LINEAR); // no bilinear filtering gl.glTexParameteri( GL.GL_TEXTURE_2D, GL.GL_TEXTURE_MAG_FILTER, GL.GL_NEAREST);
![Page 37: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/37.jpg)
MinificationProblems also occur when we zoom out too far from a texture.
We can have more than one texel mapping to a pixel.
If image pixels line up with regularities in the texture, strange artefacts appear in the output such as moire patterns or shimmering in an animation
![Page 38: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/38.jpg)
Minification
one pixel
texels
Again, the alignment is not exact.
![Page 39: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/39.jpg)
Minification
![Page 40: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/40.jpg)
AliasingThis effect is called aliasing. It occurs when samples are taken from an image at a lower resolution than repeating detail in the image.
texels
![Page 41: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/41.jpg)
AliasingThis effect is called aliasing. It occurs when samples are taken from an image at a lower resolution than repeating detail in the image.
pixels
![Page 42: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/42.jpg)
AliasingThis effect is called aliasing. It occurs when samples are taken from an image at a lower resolution than repeating detail in the image.
samples
![Page 43: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/43.jpg)
AliasingThis effect is called aliasing. It occurs when samples are taken from an image at a lower resolution than repeating detail in the image.
result
![Page 44: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/44.jpg)
FilteringThe problem is that one screen pixel overlaps multiple texels but is taking its value from only one of those texels.
A better approach is to average the texels that contribute to that pixel.
Doing this on the fly is expensive.
![Page 45: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/45.jpg)
MIP mappingMipmaps are precomputed low-res versions of a texture.
Starting with a 512x512 texture we compute and store 256x256, 128x128, 64x64, 32x32, 16x16, 8x8, 4x4, 2x2 and 1x1 versions.
This takes total memory = 4/3 original.
![Page 46: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/46.jpg)
Using mipmapsThe simplest approach is to use the next smallest mipmap for the required resolution.
E.g. To render a 40x40 pixel image, use the 32x32 pixel mipmap and magnify using magnification filter
![Page 47: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/47.jpg)
Trilinear filteringA more costly approach is trilinear filtering:
• Use bilinear filtering to compute pixel values based on the next highest and the next lowest mipmap resolutions.
• Interpolate between these values depending on the desired resolution.
![Page 48: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/48.jpg)
Minification Filtering//bilinear filtering with no mipmaps gl.glTexParameteri( GL.GL_TEXTURE_2D, GL.GL_TEXTURE_MIN_FILTER, GL.GL_LINEAR); // no bilinear filtering with no mipmaps gl.glTexParameteri( GL.GL_TEXTURE_2D, GL.GL_TEXTURE_MIN_FILTER, GL.GL_NEAREST);
![Page 49: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/49.jpg)
Generating Mip-Maps//get opengl to auto-generate
//mip-maps. gl.glGenerateMipmap(GL2.GL_TEXTURE_2D);
// Must make sure you set the
// appropriate min filters
// once you have done this
![Page 50: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/50.jpg)
MipMap Minification Filtering
// use nearest mipmap gl.glTexParameteri( GL.GL_TEXTURE_2D, GL.GL_TEXTURE_MIN_FILTER, GL.GL_NEAREST_MIPMAP_NEAREST); // use trilinear filtering gl.glTexParameteri( GL.GL_TEXTURE_2D, GL.GL_TEXTURE_MIN_FILTER, GL.GL_LINEAR_MIPMAP_LINEAR);
![Page 51: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/51.jpg)
Aniso FilteringIf a polygon is on an oblique angle away from the camera, then minification may occur much more strongly in one dimension than the other.
![Page 52: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/52.jpg)
Aniso filteringAnisotropic filtering is filtering which treats the two axes independently.
float fLargest[] = new float[1]; gl.glGetFloatv(GL.GL_MAX_TEXTURE_MAX_ANISOTROPY_EXT, fLargest,0);
gl.glTexParameterf(GL.GL_TEXTURE_2D, GL.GL_TEXTURE_MAX_ANISOTROPY_EXT, fLargest[0]);
![Page 53: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/53.jpg)
Aniso Filtering
![Page 54: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/54.jpg)
RIP MappingRIP mapping is an extension of MIP mapping which down-samples each axis and is an approach to anisotropic filtering
So a 256x256 image has copies at:
256x128, 256x64, 256x32, 256x16, ..., 128x256, 128x128, 128x64, .... 64x256, 64x128, etc.
![Page 55: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/55.jpg)
![Page 56: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/56.jpg)
RIP MappingLimitations of RIP Mapping:
• Does not handle diagonal anisotropy.• More memory required for RIP maps (4
times as much).• Not implemented in OpenGL
![Page 57: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/57.jpg)
Multi-texturingCan use more than one texture on the same fragment.gl.glActiveTexture(GL2.GL_TEXTURE0); gl.glBindTexture(GL2.GL_TEXTURE_2D, texId1);
gl.glActiveTexture(GL2.GL_TEXTURE1); gl.glBindTexture(GL2.GL_TEXTURE_2D, texId2);
gl.glTexEnvi(GL2.GL_TEXTURE_ENV, GL2.GL_TEXTURE_ENV_MODE, GL2.GL_COMBINE);
![Page 58: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/58.jpg)
Multi-texturingGL_COMBINE, instead of default GL_REPLACE, indicates that the first texture unit combines with the zeroth by application of a texture combiner function.
An example texture combiner function isgl.glTexEnvi(GL TEXTURE ENV, GL COMBINE RGB, GL INTERPOLATE);
//Uses Arg0 * Arg2 + Arg1 * (1-Arg2)
//See code for setting up the Arg0,Arg1,Arg2 values
![Page 59: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/59.jpg)
Multi-texturingNeed to define different sets of texture coordinates
gl.glMultiTexCoord2d(GL2.GL_TEXTURE0, 0.5, 1.0); gl.glMultiTexCoord2d(GL2.GL_TEXTURE1, 0.5, 1.0);
gl.glVertex3d(….);
![Page 60: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/60.jpg)
Animated texturesAnimated textures can be achieved by loading multiple textures and using a different one on each frame.
![Page 61: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/61.jpg)
![Page 62: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/62.jpg)
Textures and ShadersVertex Shader
Simply pass through the texture coords to the fragment shader (they will be interpolated).out vec2 texCoord;
void main(void){
//gl_MultiTexCoord0 has texture coords
texCoord = vec2(gl_MultiTexCoord0);
}
![Page 63: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/63.jpg)
Textures and ShadersFragment Shader
//passed in by vertex shader
in vec2 texCoord;
//texture variable passed in by jogl program
uniform sampler2D texUnit1;
//This would implement replace mode
gl_FragColor = texture(texUnit1,texCoord);
![Page 64: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/64.jpg)
Textures and ShadersFragment Shader
//For modulate with simple coloured vertices
gl_FragColor = texture(texUnit1,texCoord) * gl_Color;
//For modulate with separate specular with
//lighting
gl_FragColor =
texture(texUnit1,texCoord) * (emissive + ambient + diffuse) + specular
![Page 65: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/65.jpg)
Textures and Shaders//In your jogl program, link texture variables
texUnitLoc =
gl.glGetUniformLocation(shaderprog,"texUnit1");
// By default unless we are using mult-texturing
// we always bind to texture0
gl.glUniform1i(texUnitLoc , 0);
![Page 66: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/66.jpg)
ExercisesHow can we modify our texturing example to use VBOs instead of immediate mode?
![Page 67: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/67.jpg)
Rendering to a textureA common trick is to set up a camera in a scene, render the scene into an offscreen buffer, then copy the image into a texture to use as part of another scene.
E.g. Implementing a security camera in a game.
//In openGL you can use
gl.glCopyTexImage2D(…);
![Page 68: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/68.jpg)
lostandtaken.comopengameart.org/textures
textures.com
![Page 69: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/69.jpg)
ReflectionTo do better quality reflections we need to compute where the reflected light is coming from in the scene.
Eye
Reflectiveobject
Object seen
![Page 70: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/70.jpg)
Reflection mappingDoing this in general is expensive, but we can do a reasonable approximation with textures:
• Generate a cube that encloses the reflective object.
• Place a camera at the centre of the cube and render the outside world onto the faces of the cube.
• Use this image to texture the object
![Page 71: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/71.jpg)
Reflection mapping
Reflectiveobject
![Page 72: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/72.jpg)
Reflection mapping
Cube
![Page 73: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/73.jpg)
Reflection mapping
Camera
Render sceneonto cube
![Page 74: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/74.jpg)
Reflection mapping
Camera
Repeat foreach face
![Page 75: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/75.jpg)
Reflection mapping
Camera
Repeat foreach face
![Page 76: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/76.jpg)
Reflection mapping
Camera
Repeat foreach face
![Page 77: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/77.jpg)
Reflection mappingTo apply the reflection-mapped texture to the object we need to calculate appropriate texture coordinates.
We do this by tracing a ray from the camera, reflecting it off the object and then calculating where it intersects the cube.
![Page 78: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/78.jpg)
Reflection mapping
CubeEye View vector
normal
point
![Page 79: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/79.jpg)
Reflection mappingPros:
• Produces reasonably convincing polished metal surfaces and mirrors
![Page 80: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/80.jpg)
Reflection mappingCons:
• Expensive: Requires 6 additional render passes per object
• Angles to near objects are wrong.• Does not handle self-reflections or
recursive reflections.
![Page 81: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/81.jpg)
![Page 82: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/82.jpg)
OpenGL OpenGL has built in support for fast approximate reflection mapping (cube mapping).
http://www.nvidia.com/object/cube_map_ogl_tutorial.html
OpenGL also has sphere mapping support, although this usually produces more distortion and is not as effective as cube mapping.
![Page 83: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/83.jpg)
ShadowsOur lighting model does not currently produce shadows.
We need to take into account whether the light source is occluded by another object.
![Page 84: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/84.jpg)
Shadow bufferingOne solution is to keep a shadow buffer for each light source.
The shadow buffer is like the depth buffer, it records the distance from the light source to the closest object in each direction.
![Page 85: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/85.jpg)
Shadow bufferShadow rendering is usually done in multiple passes:
1.Render the scene from the light's viewpoint capturing only z-info in shadow buffer (color buffer turned off)
2.Render the scene from camera’s viewpoint in ambient light first
3.Render the scene from camera’s point of view for each light and add the pixel values for lit objects
![Page 86: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/86.jpg)
Shadow bufferWhen rendering a point P:
• Project the point into the light's clip space.
• Calculate the index (i,j) for P in the shadow buffer
• Calculate the pseudodepth d relative to the light source
• If shadow[i,j] < d then P is in the shadow
![Page 87: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/87.jpg)
Shadow bufferPros:
• Provides realistic shadows• No knowledge or processing of the
scene geometry is required
![Page 88: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/88.jpg)
Shadow bufferCons:
• More computation• Shadow quality is limited by precision of shadow
buffer. This may cause some aliasing artefacts. • Shadow edges are hard.• The scene geometry must be rendered once per
light in order to generate the shadow map for a spotlight, and more times for an omnidirectional point light.
![Page 89: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/89.jpg)
![Page 90: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/90.jpg)
OpenGLhttp://www.paulsprojects.net/tutorials/smt/smt.html
![Page 91: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/91.jpg)
Light MappingIf our light sources and large portions of the geometry are static then we can precompute the lighting equations and store the results in textures called light maps.
This process is known as baked lighting.
![Page 92: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/92.jpg)
Light MappingPros:
• Sophisticated lighting effects can be computed at compile time, where speed is less of an issue.
![Page 93: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/93.jpg)
Light mappingCons:
• Memory and loading times for many individual light maps.
• Not suitable for dynamic lights or moving objects.
• Potential aliasing effects depending on the resolution of the light maps.
![Page 94: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/94.jpg)
Normal mappingWhen we interpolate normals in a Phong shader we are assuming that the surface of the polygon is smoothly curved.
What if the surface is actually rough with many small deformities?
Putting a rough texture on a smooth flat surface looks wrong.
![Page 95: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/95.jpg)
Normal mappingOne solution would be to increase the number of polygons to represent all the deformities, but this is computationally unfeasible for most applications.
Instead we use textures called normal maps to simulate minor perturbations in the surface normal.
![Page 96: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/96.jpg)
Normal mapsRather than arrays of colours, normal maps can be considered as arrays of vectors. These vectors are added to the interpolated normals to give the appearance of roughness.
Vertex normals
![Page 97: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/97.jpg)
Normal mapsRather than arrays of colours, normal maps can be considered as arrays of vectors. These vectors are added to the interpolated normals to give the appearance of roughness.
Interpolatedfragment normals
![Page 98: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/98.jpg)
Normal mapsRather than arrays of colours, normal maps can be considered as arrays of vectors. These vectors are added to the interpolated normals to give the appearance of roughness.
Normal map
![Page 99: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/99.jpg)
Normal mapsRather than arrays of colours, normal maps can be considered as arrays of vectors. These vectors are added to the interpolated normals to give the appearance of roughness.
Perturbednormals
![Page 100: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/100.jpg)
Normal mapsPros:
• Provide the illusion of surface texture
Cons:• Does not affect silhouette• Does not affect occlusion calculation
![Page 101: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/101.jpg)
Normal Mapping
![Page 102: 08 Textures - Computer Science and Engineeringcs3421/16s2/lectures/08_Textures.pdf · It is also possible to write code to compute the texture value at a point. This can be good to](https://reader033.vdocuments.net/reader033/viewer/2022060903/609f3c40af575d0208021b13/html5/thumbnails/102.jpg)
OpenGL
http://www.opengl-tutorial.org/intermediate-tutorials/tutorial-13-normal-mapping/
http://www.terathon.com/code/tangent.html