Chapter 7

Textures and Mapping Techniques

Applying texture with UV mapping

A texture is basically an image represented by a chunk of memory in the computer; this memory contains color information in the form of red (R), green (G), blue (B), and alpha (A) components; each component is represented as a series of bits/bytes, depending on the format of the type of texture. This recipe allows to play with textures in OpenGL ES 3.0.

In this recipe, we will create a simple texture image and learn

  1. UV and ST coordinate system
  2. Texture wrapping
  3. Texture filtering: Minification and Magnification
  4. Mip-Mapping

Efficient rendering with the ETC2 compressed texture

The OpenGL ES 3.0 specifications made it compulsory for all vendors to support ETC2 and EAC texture compression formats. Compressed textures increase the performance, reduces the memory footprints and keep the application size smaller for faster downloading.

In this recipe, we will demonstrate ETC2 (Ericson Texture Compression), which is very famous texture compression schemes. This is a lossy texture compression technique; Additionally, this recipe also demonstrates loading the non-power of two (NPOT) texture which is a new feature in OpenGL ES 3.0.

Applying multiple textures

The multi-texturing allows to apply more than one texture on a given geometry surface to produce many interesting results; modern graphics allow you to apply multiple textures on to geometry by means of texture units.

In this recipe, you will learn how to make use of OpenGL ES texture units in order to implement multi-texturing. Here, we will use two textures (wooden and wine glass) and combine them onto the GPU to produce single texture.

Implementing Skybox with seamless cube mapping

Cube mapping is a texturing technique used in 3D graphics to fill the background of a scene with a given set of images. This technique reduces the number of objects required to draw a scene in order to make the scene look populated (the scene looks bigger). It is commonly used in gaming to render sky horizons, rooms, mountains, day/night effect, reflection, and refraction.

In the cube mapping technique, the viewer or camera is always in the center of the cube. When camera displaces in the 3D space, the cube is also displaced with respect to it. This way, the camera never reaches close to any face of the cube and creates an illusion of a horizon that always remains at the same distance from the viewers point.

Implementing reflection with environment mapping

Environment mapping is a simple yet effective and efficient technique that allows you to map the surrounding environment to the rendered 3D objects. There are two ways in which environment mapping can be used: reflection and refraction.

In the reflection technique, rendered objects are mapped with the reflection of the surroundings, which shows the reflection of the surrounding view. This recipe implements the reflection environment mapping.

Implementing refraction with environment mapping

Like reflection environment mapping, this recipe implements refraction mapping. In the refraction mapping case, objects mapped with the refraction allow you to see through objects. 

The environment mapping techniques require cube mapping that we programmed in the previous recipe Skybox with seamless cube mapping.

Implementing render to texture with Frame Buffer Objects

The OpenGL ES renders a scene on framebuffer; this framebuffer is called the default framebuffer. A framebuffer consist of various buffers, such as color, depth, and the stencil buffer. Frame Buffer Objects (FBO) allows you to create user-defined framebuffers, which can be used to render scenes on non-default framebuffers.

The rendered scene on the non default framebuffer can be used as a texture to map on the objects. This recipe will demonstrate render to texture in which a scene is rendered to a texture and this texture is mapped to a 2D plane surface; the 2D plane can be rotated in a 3D space using touch gesture events.

Implementing terrain with displacement mapping

The displacement mapping technique modifies the surface of a geometric shape using procedural texture or texture image. This recipe uses the textured image called height maps to implement a geographical terrain surface on a 2D plane.

The 2D plane is represented by a set of vertices arranged in a grid fashion; the elevation information for each vertex in this 3D grid space is read from the height map.

Implementing bump mapping

The Bump mapping adds depth details or elevations to the surface of the geometry. However, this depth or elevation is fake. The geometry vertices do not undergo any change in the elevation. Instead, it uses the light illumination techniques(normal-maps) to simulate the depth appearance on a smooth surface. 

This chapter will discuss such techniques to bring fake realism in the scene. In this recipe, we will implement an earth globe, which makes use of the normal map to produce the bump mapping effect; this makes the 3D depth information more obvious on the globe surface.